使用jQuery可以给元素很方便的添加class和删除class等操作，现在原生的JavaScript也可以实现这个方法了。使用classList可以方便的添加class、删除class、查询class等。语法：let elementClass = element.classList;elementClasses 是一个 DOMTokenList 表示 element 的类属性 。如果类属性未设置或为空，那么 elementClasses.length 返回 0。element.classList 本身是只读的，虽然你可以使用 add() 和 remove() 方法修改它。方法：add( String [, String] )添加指定的类值。如果这些类已经存在于元素的属性中，那么它们将被忽略。remove( String [,String] )删除指定的类值。item ( Number )按集合中的索引返回类值。toggle ( String [, force] )当只有一个参数时：切换 class value; 即如果类存在，则删除它并返回false，如果不存在，则添加它并返回true。当存在第二个参数时：如果第二个参数的计算结果为true，则添加指定的类值，如果计算结果为false，则删除它contains( String )检查元素的类属性中是否存在指定的类值。示例：// div是具有class =“foo bar”的<div>元素的对象引用div.classList.remove(“foo”);div.classList.add(“anotherclass”);// 如果visible被设置则删除它，否则添加它div.classList.toggle(“visible”);// 添加/删除 visible，取决于测试条件，i小于10div.classList.toggle(“visible”, i < 10);alert(div.classList.contains(“foo”));//添加或删除多个类div.classList.add(“foo”,“bar”);div.classList.remove(“foo”, “bar”);兼容性：不兼容Android2.3和iOS4.2的，在移动端上想使用也是有点头疼啊。IE系列的更别说IE9和IE8了。所以目前来看，还是无法在实际中放心的使用，只能用于某些特定的项目等。不过我们可以通过一些shim来实现，或者最下方给出的原生javascript实现。跨浏览器javascript shimhttps://github.com/eligrey/cl…原生JavaScript类似于jQuery库的使用方式，使用className通过正则来添加或者删除class。addClass、removeClass、toggleClass、hasClassfunction hasClass(obj, cls) { return obj.className.match(new RegExp(’(\s|^)’ + cls + ‘(\s|$)’)); } function addClass(obj, cls) { if (!this.hasClass(obj, cls)) obj.className += " " + cls; } function removeClass(obj, cls) { if (hasClass(obj, cls)) { var reg = new RegExp(’(\s|^)’ + cls + ‘(\s|$)’); obj.className = obj.className.replace(reg, ’ ‘); } } function toggleClass(obj,cls){ if(hasClass(obj,cls)){ removeClass(obj, cls); }else{ addClass(obj, cls); } }参考链接：https://blog.csdn.net/leadn/a…