之前我们要操作一个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. HBase伪分布式安装(HDFS)+ZooKeeper安装+HBase数据操作+HBase架构体系

    HBase1.2.2伪分布式安装(HDFS)+ZooKeeper-3.4.8安装配置+HBase表和数据操作+HBase的架构体系+单例安装,记录了在Ubuntu下对HBase1.2.2的实践操作,H ...

  2. 菜鸟学习Spring——SpringMVC注解版前台向后台传值的两种方式

    一.概述. 在很多企业的开法中常常用到SpringMVC+Spring+Hibernate(mybatis)这样的架构,SpringMVC相当于Struts是页面到Contorller直接的交互的框架 ...

  3. Java的输入/输出操作

    Java的输入\输出机制 计算机的基本功能就是通过输入输出设备与外部其他设备尽心数据的交互,从其他设备读入数据叫做输入操作,将计算机内的数据写入到其他设备叫做输出操作.可以向计算机发送数据.又可以接受 ...

  4. 安装PYTHON PIL包

    安装pillow而不是PIL pip install pillow 参考: https://github.com/python-pillow/Pillow

  5. 使用slmgr查看、删除windows 授权(key)

    查看 slmgr.vbs /dlv 删除授权 使用管理员权限进入cmd All program -> accessories -> Command Prompt (右键 已管理员方式运行) ...

  6. Docker入门系列之二:使用dockerfile制作包含指定web应用的镜像

    实现题目描述的这个需求有很多种办法,作为入门,让我们从最简单的办法开始. 首先使用命令docker ps确保当前没有正在运行的Docker实例. 运行命令docker run -it nginx: 然 ...

  7. Jmeter入门10 jmeter加密串处理方式2:BeanShell PreProcessor

    上一个博客讲了方式一:函数助手__digest加密,BeanShell PreProcessor也可以用java代码进行处理 线程组.参数.请求都直接使用上一个博客的. 第一步 添加BeanShell ...

  8. 课堂笔记--------JavaScript 的DOM操作

    1.DOM的基本概念 DOM是文档对象模型,这种模型为树模型:文档是指标签文档:对象是指文档中每个元素:模型是指抽象化的东西. 2.Window对象操作 一.属性和方法: 属性(值或者子对象): op ...

  9. 报表技术之PDF格式报表生成 ----JasperResport

    JasperReport简介 JasperReport:java提供的一个类库,承上启下,读取IReport生成的xxx.jrxml文件,获取到pdf中需要显示的全部内容,然后底层调用IText相关的 ...

  10. vue中a的href写法

    注意点:href前面要加“:”或者v-bind: 2.字符串要用单引号“ ’ ”包住 加上了冒号是为了动态绑定数据,等号后面可以写变量. 如果不使用冒号,等号后面就可以写字符串等原始类型数据.这是就无 ...