另一个元素填充。classList在这里。我是通过MDN找到的。

我包括该脚本，并使用element.classList.add(“第一”，“第二”，“第三”)，因为它的意图。

我喜欢@rich。kelly的答案，但我想使用与classList.add()(逗号分隔字符串)相同的命名法，因此稍有偏差。

DOMTokenList.prototype.addMany = DOMTokenList.prototype.addMany || function() {
  for (var i = 0; i < arguments.length; i++) {
    this.add(arguments[i]);
  }
}
DOMTokenList.prototype.removeMany = DOMTokenList.prototype.removeMany || function() {
  for (var i = 0; i < arguments.length; i++) {
    this.remove(arguments[i]);
  }
}

所以你可以使用:

document.body.classList.addMany('class-one','class-two','class-three');

我需要测试所有的浏览器，但这适用于Chrome。 我们是否应该检查一些比DOMTokenList.prototype.addMany的存在更具体的东西?究竟是什么原因导致classList.add()在IE11中失败?

你可以像下面这样做

Add

elem.classList.add("first", "second", "third");

// OR

elem.classList.add(...["first","second","third"]);

删除

elem.classList.remove("first", "second", "third");

// OR

elem.classList.remove(...["first","second","third"]);

参考

TLDR;

在上述直接的情况下，拆卸应该工作。但是在删除的情况下，应该在删除它们之前确保类存在

const classes = ["first","second","third"];
classes.forEach(c => {
  if (elem.classList.contains(c)) {
     element.classList.remove(c);
  }
})

下面是一个针对ie10和ie11用户的工作，看起来非常简单。

var elem = document.getElementById（'elem'）; ['first'，'second'，'three'].forEach（item => elem.classList.add（item））; <div id=“elem”>Hello World！</div>

Or

var elem = document.getElementById（'elem'）， 类 = [“第一”、“第二”、“第三”]; classes.forEach（function（item） { elem.classList.add（item）; }); <div id=“elem”>Hello World！</div>

classList属性确保重复的类不会不必要地添加到元素中。为了保持这个功能，如果你不喜欢手工版本或jQuery版本，我建议添加一个addMany函数和removmany到DOMTokenList (classList的类型):

DOMTokenList.prototype.addMany = function(classes) {
    var array = classes.split(' ');
    for (var i = 0, length = array.length; i < length; i++) {
      this.add(array[i]);
    }
}

DOMTokenList.prototype.removeMany = function(classes) {
    var array = classes.split(' ');
    for (var i = 0, length = array.length; i < length; i++) {
      this.remove(array[i]);
    }
}

这些可以像这样使用:

elem.classList.addMany("first second third");
elem.classList.removeMany("first third");

更新

根据你的评论，如果你只希望在这些事件没有定义时为它们编写一个自定义方法，请尝试以下方法:

DOMTokenList.prototype.addMany = DOMTokenList.prototype.addMany || function(classes) {...}
DOMTokenList.prototype.removeMany = DOMTokenList.prototype.removeMany || function(classes) {...}

新的展开操作符使应用多个CSS类作为数组更加容易:

const list = ['first', 'second', 'third'];
element.classList.add(...list);