首页 > 编程知识 正文

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

时间:2023-05-04 09:22:45 阅读:262427 作者:3121

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"); // 删除样式。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));}


版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。