之前我们要操作一个DOM元素的class属性,需要对这个DOM的class进行繁琐的循环判断,而现在HTML5为每个元素定义了classLlist属性,用于在元素中添加,移除及切换 CSS 类。该属性是 DOMTokenList 对象(一个只读的类数组对象),你可以通过DOMTokenList定义的方法对其进行修改。

支持classList属性的浏览器版本:

语法:element.classList

方法:

add(class1, class2, ...): 在元素中添加一个或多个类名, 如果指定的类名已存在,则不会添加

contains(class): 返回布尔值,判断指定的类名是否存在

item(index): 返回类名在元素中的索引值, 索引值从 0 开始, 如果索引值在区间范围外则返回 null

remove(class1, class2, ...): 移除元素中一个或多个类名, 注意: 移除不存在的类名,不会报错

toggle(class, true|false): 在元素中切换类名

           第一个参数为要在元素中移除的类名,并返回 false。如果该类名不存在则会在元素中添加类名,并返回 true

           第二个是可选参数,是个布尔值用于设置元素是否强制添加或移除类,不管该类名是否存在

classList属性详解的更多相关文章

  1. android:exported 属性详解

    属性详解 标签: android 2015-06-11 17:47 27940人阅读 评论(7) 收藏 举报 分类: Android(95) 项目点滴(25) 昨天在用360扫描应用漏洞时,扫描结果, ...

  2. OutputCache属性详解(一)一Duration、VaryByParam

    目录 OutputCache概念学习 OutputCache属性详解(一) OutputCache属性详解(二) OutputCache属性详解(三) OutputCache属性详解(四)— SqlD ...

  3. OutputCache属性详解(二)一 Location

    目录 OutputCache概念学习 OutputCache属性详解(一) OutputCache属性详解(二) OutputCache属性详解(三) OutputCache属性详解(四)— SqlD ...

  4. OutputCache属性详解(三)— VaryByHeader,VaryByCustom

    目录 OutputCache概念学习 OutputCache属性详解(一) OutputCache属性详解(二) OutputCache属性详解(三) OutputCache属性详解(四)— SqlD ...

  5. OutputCache属性详解(四)— SqlDependency

    目录 OutputCache概念学习 OutputCache属性详解(一) OutputCache属性详解(二) OutputCache属性详解(三) OutputCache属性详解(四)— SqlD ...

  6. WPF依赖属性详解

    WPF依赖属性详解 WPF 依赖属性 英文译为 Dependency Properties,是WPF引入的一种新类型的属性,在WPF中有着极为广泛的应用,在WPF中对于WPF Dependency P ...

  7. HTML video 视频标签全属性详解

    HTML 5 video 视频标签全属性详解   现在如果要在页面中使用video标签,需要考虑三种情况,支持Ogg Theora或者VP8(如果这玩意儿没出事的话)的(Opera.Mozilla.C ...

  8. Android组件---四大布局的属性详解

    [声明] 欢迎转载,但请保留文章原始出处→_→ 文章来源:http://www.cnblogs.com/smyhvae/p/4372222.html Android常见布局有下面几种: LinearL ...

  9. dede的pagelist标签的listsize数字属性详解(借鉴)

    dede的pagelist标签的listsize数字属性详解.见远seo经常用织梦搭建各种网站,有次发现列表页面的分页显示超过div的界限,也就是溢出了或者说是撑破了.后来经过研究发现是pagelis ...

随机推荐

  1. 中值滤波C语言优化

    中值滤波C语言优化 图像平滑是图像预处理的基本操作,本文首先用不同的方法对一张图片做预处理比较它们效果的不同,然后针对中值滤波,实现了一种快速实现.(其实是copy的opencv实现,呵呵).因为op ...

  2. 菜鸟学习Spring——SpringIoC容器基于三种配置的对比

    一.概述 对于实现Bean信息定义的目标,它提供了基于XML.基于注解及基于java类这三种选项.下面总结一下三种配置方式的差异. 二.Bean不同配置方式比较. 三.Bean不同配置方式的适用场合. ...

  3. 菜鸟学习Spring——SpringMVC注解版控制层重定向到控制层

    一.概述. SpringMVC中界面请求Contorller1,Contorller1需要重定向到Contorller2中显示其他页面或者做一些业务逻辑,Spring中提供了这个功能利用"r ...

  4. MongoDB(online) 优化

    MongoDB(online) 优化 1. find.findOne 2. 操作 vip_emp_relation 的一个公共方法 3. 查询记录数 4. save.insert 5. 总结 1. f ...

  5. [C#] SHA1校验函数用法

    首先引用这个命名空间 using System.Security.Cryptography; //建立SHA1对象 SHA1 sha = new SHA1CryptoServiceProvider() ...

  6. solidity语言14

    库(Libraries) 库类似合约,实现仅在专门地址部署一次,使用EVM的DELEGATECALL的功能重复使用的目的.意思是当库函数被调用后,代码执行在被调用的合约的环境.例如,使用this调用合 ...

  7. 猿创|有赞的zan framework安装与使用[2]

    下载并安装comoser curl -sS https://getcomposer.org/installer | php 结果各种超时 不能忍,打开迅雷下载installer:https://get ...

  8. 3.Zabbix 3.0 部署

    请查看我的有道云笔记: http://note.youdao.com/noteshare?id=0139b8d2833129740be82e36a94e4fca&sub=5931260FCC8 ...

  9. day2 数据结构和一些基础知识

    请查看我的云笔记链接: http://note.youdao.com/noteshare?id=4171342601326695ec87866e1cc3e410&sub=20CFB149543 ...

  10. May 26th 2017 Week 21st Friday

    One thorn of experience is worth a whole wilderness of warning. 一次痛彻心扉的经历,抵得上千百次的告诫. Several days ag ...