如何创建 - 删除一个类
了解如何使用 JavaScript 从元素中删除类名。
Click the button to remove a class from me!
Remove Class
步骤 1) 添加 HTML:
在本例中,我们将使用一个按钮从 id="myDIV" 的 <div> 元素中删除"mystyle"类:
实例
<button onclick="myFunction()">Try it</button>
<div id="myDIV"
class="mystyle">
This is a DIV element.
</div>
步骤 2) 添加 CSS:
样式指定类名:
实例
.mystyle {
width: 100%;
padding:
25px;
background-color: coral;
color: white;
font-size: 25px;
}
步骤 3) 添加 JavaScript:
获取 id="myDIV" 的 <div> 元素并从中删除 "mystyle" 类:
实例
function myFunction() {
var element = document.getElementById("myDIV");
element.classList.remove("mystyle");
}
亲自试一试 »
跨浏览器解决方案
注释: Internet Explorer 9 不支持 classList 属性。以下代码适用于所有浏览器:
实例
function myFunction() {
var element =
document.getElementById("myDIV");
element.className =
element.className.replace(/\bmystyle\b/g, "");
}
亲自试一试 »
提示:另请参阅如何切换类。
提示:另请参阅如何添加类。
提示:在我们的 JavaScript 参考中详细了解 classList 属性。
提示:在我们的 JavaScript 参考中详细了解 className 属性。