我有一个元素已经有一个类：
<div class="someclass">
<img ... id="image1" name="image1" />
</div>
现在，我想创建一个JavaScript函数，它将向div添加一个类（不是替换，而是添加）。
我该怎么做？
当前回答
大多数人在getElementById上使用.classList.add，但我想在getElementByClassName上使用它。为此，我使用了如下的forEach：
document.getElementsByClassName（“类名”）.forEach（element=>element.classList.add（“new class”））；
但它不起作用，因为我发现getElementsByClassName返回的是HTML集合，而不是数组。为了处理这个问题，我使用以下代码将其转换为数组：
[…document.getElementsByClassName（“类名”）].forEach（element=>element.classList.add（“new class”））；
其他回答
要向元素添加其他类，请执行以下操作：
要在不删除/影响现有值的情况下将类添加到元素，请附加一个空格和新类名，如下所示：
document.getElementById("MyElement").className += " MyClass";
要更改元素的所有类，请执行以下操作：
要用一个或多个新类替换所有现有类，请设置className属性：
document.getElementById("MyElement").className = "MyClass";
（可以使用空格分隔的列表来应用多个类。）
可以使用classList.add或classList.remove方法从元素中添加/删除类。
var nameElem = document.getElementById("name")
nameElem.classList.add("anyclss")
上述代码将向nameElem添加（而不是替换）一个类“anyclass”。类似地，可以使用classList.remove（）方法删除类。
nameElem.classList.remove("anyclss")
如果您不想使用jQuery并希望支持较旧的浏览器：
function addClass(elem, clazz) {
if (!elemHasClass(elem, clazz)) {
elem.className += " " + clazz;
}
}
function elemHasClass(elem, clazz) {
return new RegExp("( |^)" + clazz + "( |$)").test(elem.className);
}
使用纯JavaScript将类添加到元素的另一种方法
对于添加类：
document.getElementById("div1").classList.add("classToBeAdded");
要删除类：
document.getElementById("div1").classList.remove("classToBeRemoved");
如果您只针对现代浏览器：
使用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";
注意其他类之前的空格。包含空间很重要，否则它会损害类列表中前面的现有类。
另请参见MDN上的element.className。
