由于element.classListIE 9 和 Safari-5 不支持，有什么替代的跨浏览器解决方案？
请无框架。
解决方案必须至少适用于IE 9、Safari 5、FireFox 4、Opera 11.5 和 Chrome。
相关帖子（但不包含解决方案）：
如何在 JavaScript 中添加/删除类？
IT技术
javascript
dom
cross-browser
2021-01-18 06:46:28
6个回答
这是纯 javascript 解决方案中 addClass、removeClass、hasClass 的解决方案。
实际上它来自http://jaketrent.com/post/addremove-classes-raw-javascript/
function hasClass(ele,cls) {
return !!ele.className.match(new RegExp('(\\s|^)'+cls+'(\\s|$)'));
}
function addClass(ele,cls) {
if (!hasClass(ele,cls)) ele.className += " "+cls;
}
function removeClass(ele,cls) {
if (hasClass(ele,cls)) {
var reg = new RegExp('(\\s|^)'+cls+'(\\s|$)');
ele.className=ele.className.replace(reg,' ');
}
}
看看这些oneliners：
删除类：
element.classList.remove('hidden');切换类（如果该类不存在则添加该类，如果存在则将其删除）
element.classList.toggle('hidden');
就这样！我做了一个测试 - 10000 次迭代。0.8 秒。
我刚刚写了这些：
function addClass(el, classNameToAdd){
el.className += ' ' + classNameToAdd;
}
function removeClass(el, classNameToRemove){
var elClass = ' ' + el.className + ' ';
while(elClass.indexOf(' ' + classNameToRemove + ' ') !== -1){
elClass = elClass.replace(' ' + classNameToRemove + ' ', '');
}
el.className = elClass;
}
我认为它们适用于所有浏览器。
最简单的是element.classList它具有remove(name)、add(name)、toggle(name)和contains(name)方法，现在所有主要浏览器都支持。
对于较旧的浏览器，您可以更改element.className. 这里有两个帮手：
function addClass(element, className){
element.className += ' ' + className;
}
function removeClass(element, className) {
element.className = element.className.replace(
new RegExp('( |^)' + className + '( |$)', 'g'), ' ').trim();
}
在没有框架/库的情况下使用类的一种方法是使用属性 Element.className，它“获取和设置指定元素的类属性的值。 ”（来自MDN 文档）。
正如@matías-fidemraizer在他的回答中已经提到的那样，一旦您获得元素的类字符串，您就可以使用与字符串关联的任何方法来修改它。
这是一个示例：
假设您有一个 ID 为“myDiv”的 div，并且您想在用户单击它时向其中添加类“main__section”，
window.onload = init;
function init() {
document.getElementById("myDiv").onclick = addMyClass;
}
function addMyClass() {
var classString = this.className; // returns the string of all the classes for myDiv
var newClass = classString.concat(" main__section"); // Adds the class "main__section" to the string (notice the leading space)
this.className = newClass; // sets className to the new string
}