首页 >web前端 >css教程 >如何使用 Vanilla JavaScript 删除 CSS 类?

如何使用 Vanilla JavaScript 删除 CSS 类?

Patricia Arquette
Patricia Arquette原创
2024-12-20 16:08:10955浏览

How to Remove a CSS Class Using Vanilla JavaScript?

删除 CSS 类:综合 JavaScript 指南

使用原生 JavaScript 从元素中删除 CSS 类是 Web 开发人员遇到的常见任务。与提供简化 API 的 jQuery 不同,JavaScript 提供了一种多功能且低级的方法来执行此操作。

要有效删除 CSS 类,首选且标准化的技术是利用 classList 属性。它受现代浏览器的支持,可实现精确的类操作。

解决方案

以下代码片段演示了正确的语法:

ELEMENT.classList.remove("CLASS_NAME");

此代码片段从目标元素中删除指定的类 (CLASS_NAME) (元素)。

示例

考虑以下示例,其中我们有一个按钮可以切换从 div 中删除“红色”类:

remove.onclick = () => {
  const el = document.querySelector('#el');
  el.classList.remove("red");
};
.red {
  background: red
}
<div>

点击“删除班级”按钮后,“红色”背景将会出现从 div 中删除。

了解如何使用 JavaScript 删除 CSS 类对于维护动态网页以及精确控制元素样式至关重要。

以上是如何使用 Vanilla JavaScript 删除 CSS 类?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn