CSS 类列表 - Javascript

在JavaScript中，可以使用classList属性获取元素的CSS类列表。这个属性返回一个DOMTokenList对象，它是一个元素的类名集合。

添加和删除类

可以使用add()方法添加一个类，remove()方法删除一个类，如果想要toggle()方法切换一个类，则函数会为true添加类，否则它会删除。

const element = document.getElementById('myElement');
element.classList.add('myClass');
element.classList.remove('myClass');
element.classList.toggle('myClass');

检查类的存在

可以使用contains()方法检查类是否存在于元素的classList中。

const element = document.getElementById('myElement');
if (element.classList.contains('myClass')) {
  // do something
}

获取类的数量和类列表

可以使用length属性获取元素的类列表中的类数，以及使用toString()方法获取类列表的所有类。

const element = document.getElementById('myElement');
const classCount = element.classList.length;
const classList = element.classList.toString();

迭代类列表

可以使用forEach()方法遍历元素的classList中的所有类。

const element = document.getElementById('myElement');
element.classList.forEach(function(className) {
  console.log(className);
});