classList 类数组

classList 类数组

---

        [ ]下标   元素的第几个class名字

        length   返回类列表中类的数量，该属性是只读的   var x = document.getElementById("myDIV").classList.length;

        value    className

---

    add('name') 给元素添加一个 class

document.getElementById("myDIV").classList.add("mystyle", "anotherClass", "thirdClass");

---

    remove("name") 删除掉一个 class

document.getElementById("myDIV").classList.remove("mystyle", "anotherClass", "thirdClass");

---

    contains("name") 判断元素是否有这个class true 包含|| false 不包含    

var x = document.getElementById("myDIV").classList.contains("mystyle");

---

    toggle("name"); 切换 元素如果包含 "name" 这个class 就删除，否则就添加   

  document.getElementById("myDIV").classList.toggle("newClassName");

---

    item(index) 返回元素中索引值对应的类名。索引值从 0 开始。如果索引值在区间范围外则返回 null

var x = document.getElementById("myDIV").classList.item(0);

---

实例

var x = document.getElementById("myDIV");

查看元素是否存在 "mystyle" 类，如果存在则移除另外一个类名:

if (x.classList.contains("mystyle")) {

    x.classList.remove("anotherClass");

} else {

    alert("Could not find it.");

}

---