我也认为最快的方法是使用Element.prototype.classList，如es5:document.querySelector（“.my.superclass”）.classList.add（'new-class'）但是在ie8中没有Element.prototype.classList这样的东西，无论如何，您可以用以下代码段来填充它（可以自由编辑和改进它）：

if（Element.prototype.classList==void 0）{函数DOMTokenList（类，自身）{typeof classes==“string”&&（classes=classes.split（“”））while（此长度）{Array.protocol.pop.apply（this）；}数组.原型.推送.应用（this，类）；这一点__self__=这个__自我__||自我}DOMTokenList.prototype.item=函数（索引）{返回此[索引]；}DOMTokenList.prototype.contains=函数（myClass）{对于（var i=this.length-1；i>=0；i-）{如果（this[i]==myClass）{返回true；}}return false}DOMTokenList.prototype.add=函数（newClass）{if（this.contains（newClass））{回来}这一点__self__.className+=（this.__self__.calassName？“”：“”）+newClass；DOMTokenList.call（this，this.__self__.className）}DOMTokenList.prototype.remove=函数（旧类）{if（！this.contains（newClass））{回来}this[this.indexOf（oldClass）]=未定义这一点__self__.className=this.join（''）.replace（/+/，''）DOMTokenList.call（this，this.__self__.className）}DOMTokenList.prototype.toggle=函数（aClass）{this[this.contains（aClass）？'remove'：'add']（aClass）返回this。contains（aClass）；}DOMTokenList.prototype.replace=函数（旧类，新类）{this.contains（oldClass）&&this.remove（oldClass）&&this.add（newClass）}Object.defineProperty（Element.prototype，'classList'{获取：函数（）{返回新的DOMTokenList（this.className，this）；},可枚举：false})}

我认为最好使用纯JavaScript，它可以在浏览器的DOM上运行。

这里是使用它的函数方法。我使用过ES6，但可以随意使用ES5和函数表达式或函数定义，无论哪种都适合您的JavaScript StyleGuide。

'使用严格'const oldAdd=（元素，className）=>{let classes=element.className.split（“”）if（classes.indexOf（className）<0）{classs.push（className）}element.className=classes.join（“”）}const oldRemove=（元素，className）=>{let classes=element.className.split（“”）const idx=classes.indexOf（className）如果（idx>-1）{类.拼接（idx，1）}element.className=classes.join（“”）}const addClass=（元素，className）=>{if（element.classList）{element.classList.add（className）}其他{oldAdd（元素，className）}}const removeClass=（元素，className）=>{if（element.classList）{element.classList.remove（className）}其他{oldRemove（元素，className）}}

您可以使用类似于jQuery的现代方法

如果您只需要更改一个元素，即JS将在DOM中找到的第一个元素，则可以使用以下方法：

document.querySelector（'.someclass'）.className+=“red”；.红色{颜色：红色；}<div class=“someclass”><p>此方法将仅向DOM中的第一个元素添加类“red”</p></div><div class=“someclass”><p>洛雷姆ipsum</p></div><div class=“someclass”><p>洛雷姆ipsum</p></div><div class=“someclass”><p>洛雷姆ipsum</p></div>

请记住在类名前留一个空格。

如果您有多个要添加新类的类，可以这样使用

document.querySelectorAll（'.someclass'）.forEach（函数（元素）{element.className+=“红色”；});.红色{颜色：红色；}<div class=“someclass”><p>此方法将向DOM中具有“someclass”类的所有元素添加类“red”</p＞</div><div class=“someclass”><p>洛雷姆ipsum</p></div><div class=“someclass”><p>洛雷姆ipsum</p></div><div class=“someclass”><p>洛雷姆ipsum</p></div>

要向元素添加其他类，请执行以下操作：

要在不删除/影响现有值的情况下将类添加到元素，请附加一个空格和新类名，如下所示：

document.getElementById("MyElement").className += " MyClass";

要更改元素的所有类，请执行以下操作：

要用一个或多个新类替换所有现有类，请设置className属性：

document.getElementById("MyElement").className = "MyClass";

（可以使用空格分隔的列表来应用多个类。）

如果您只针对现代浏览器：

使用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。

当我正在做的工作不需要使用库时，我使用以下两个函数：

function addClass( classname, element ) {
    var cn = element.className;
    //test for existance
    if( cn.indexOf( classname ) != -1 ) {
        return;
    }
    //add a space if the element already has class
    if( cn != '' ) {
        classname = ' '+classname;
    }
    element.className = cn+classname;
}

function removeClass( classname, element ) {
    var cn = element.className;
    var rxp = new RegExp( "\\s?\\b"+classname+"\\b", "g" );
    cn = cn.replace( rxp, '' );
    element.className = cn;
}