欢迎光临
我们一直在努力

list对象属性排序,classlist使用方法

email:gm4linus at gmail dot com

大家经常使用JQuery这样的JS框架提供的类似于addClass、removeClass等方法来操作DOM对象上的class。

DOM4级规定DOM对象需要实现一个名为classList的对象属性,该属性中提供了一些方法用于操作DOM class的方法,虽然现在尚处于草案阶段,但已经被浏览器广泛支持,从http://caniuse.sinaapp.com/html/item/classlist/index.html网站可以看出浏览器兼容性还是不错的。

所有方法介绍如下:

add : 为DOM对象加class。

remove :从DOM对象删class?。

contains :检测DOM对象是否已经应用了某class。

toggle :若DOM对象已经应用了某class则删除,若未应用则添加。

item :获取指定下表的class名字。

属性介绍:

length :DOM上应用class的个数

代码示例:

var clsList = document.getElementById(“cuebar”).classList;clsList.add(“some-css-class”); // 添加样式。clsList.remove(“some-css-class”); // 香港vps 删除样式。if(clsList.contains(“some-css-class”)){ // 是否已经使用了某样式。 // do something}clsList.toggle(“some-css-class”); // 如果some-css-class已经存在那么删除,如果不存在那么添加。for(var i = 0; i < clsList.length; i++){console.log(clsList.item(i));}

65789099

赞(2)
【声明】:本博客不参与任何交易,也非中介,仅记录个人感兴趣的主机测评结果和优惠活动,内容均不作直接、间接、法定、约定的保证。访问本博客请务必遵守有关互联网的相关法律、规定与规则。一旦您访问本博客,即表示您已经知晓并接受了此声明通告。