早先我们已经接触过jquery的hassClass,addClass,removeClass等对类的操作但有时候我们需要运用到原生的东西,此时classList就会大放光彩;
个人理解:classList就像是一个类名的集合,class代表类+list代表清单;既然是是对类的运用,那我们就对classList的成员进行逐一的介绍:
length
静态属性。获取元素类名的个数: var number=document.body.classList.length;
item
获取元素的类名,接受一个参数,即数字索引值:var name=docuemnt.body.classList.item(index);
add
用于增加元素的类,接受一个参数(类名)注:一次只能增加一个类名 : document.body.classList.add("classname");
remove
删除元素类,接受一个参数(一次只能删除一个):document.body.classList.remove(‘classname‘);
contains
检测是否包含某个类,返回布尔值。 document.body.classList.contains(‘classname‘);//true or false
toggle
相当于add remove contains的结合体,存在类就remove(),不存在就删除add();documen.body.classList.toggle(‘classname‘);
时间: 2024-10-10 13:08:26