今天看书时突然发现了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了。