原生dom如何对元素的class进行操作

今天看书时突然发现了classList属性，是DOMTokenList的实例，以数组的形式保存元素的class属性。

classList可以用来很方便的操作元素的class，对其增删该查操作。

说来惭愧，一直以来都是用jquery对元素的class进行操作，以为原生js的class操作必须要通过className属性来实现，指导今天才发现了原来H5早就提供了classList这一属性来方便开发人员编写代码。

DOMTokenList与数组类似，包含length属性，可以使用item()或者方括号来获取每个元素，同时还定义了以下方法来操作数组。

1. add(value)：添加一个类，如果已存在则不添加。

2. contains(value)：检测是否存在给定的值。返回true或false

3.remove(value)：从列表中移除给定的class。

4.toggle(value)：如果列表中已存在给定的值，删除它；如果不存在则添加它。

有了classList属性，除非是要完全清除所有类名，或者重写元素的class属性，否则就完全用不到className了。