JavaScript如何将类添加到给定的元素？

Question

我有一个已经有一个类的元素：

<div class="someclass">
    <img ... id="image1" name="image1" />
</div>

现在，我想创建一个JavaScript函数，将一个类添加到div（不是替换，而是添加）。

我怎样才能做到这一点？

Answer 1

使用element.classList.add添加一个类：

element.classList.add("my-class");

然后element.classList.remove删除一个类：

element.classList.remove("my-class");

如果需要支持Internet Explorer 9或更低版本：

className在元素的属性中添加一个空格以及新类的名称。首先，id在元素上放置一个，以便您可以轻松获取参考。

<div id="div1" class="someclass">
    <img ... id="image1" name="image1" />
</div>

然后

var d = document.getElementById("div1");
d.className += " otherclass";

注意前面的空格otherclass。重要的是要包含空格，否则会损害类列表中之前的现有类。