Element.classList是一个只读属性，它返回元素的类名，作为DOMTokenList对象，该元素用于在元素中添加，移除及切换CSS类。
对于jQuery里的hasClass、addClass、removeClass方法我们再熟悉不过了，但我们并不是在每个项目中都会去使用jQuery。在原生js中，classList可以方便的对元素的类名进行增删改查，它的构造器是DOMTokenList，提供了以下API供使用，包括length属性，item，contains，add，remove和toggle方法。
成员介绍 :
属性 :
length : 只读属性，返回一个整数，表示类列表中类的数量
方法 ：
add( String [, String] ) ： 添加指定的类，如果该类已存在，则会被忽略
remove( String [,String] ) ： 删除指定的类，其中移除一个不存在的类，不会报错
toggle ( String [, true | false] ) ： 当只有一个参数时，切换类名；当存在第二个参数时：如果为true，则添加指定的类值，如果为false，则删除它
item(number) : 按集合中的索引返回类值,索引值从0开始，索引值在区间外则返回null
contains(String) : 返回布尔值，检查元素的类属性中是否存在指定的类值
浏览器兼容性 :
浏览器兼容性.png
实例 ：
<div id="root">
这是一段文字
</div>
#root{
width: 400px;
height: 50px;
text-align: center;
padding: 15px;
border: 1px solid #000;
}
.firstClass{
color : red;
}
.secondClass{
background-color: blue;
}
window.onload = function(){
document.getElementById("root").classList.add("firstClass","secondClass");
}
效果图.png
该文章同步在 :
CSDN Blog： http://blog.csdn.net/levinhax/article/details/76668475
GitHub Page : https://levinhax.github.io/
