classList属性详解
之前我们要操作一个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属性详解的更多相关文章
- android:exported 属性详解
属性详解 标签: android 2015-06-11 17:47 27940人阅读 评论(7) 收藏 举报 分类: Android(95) 项目点滴(25) 昨天在用360扫描应用漏洞时,扫描结果, ...
- OutputCache属性详解(一)一Duration、VaryByParam
目录 OutputCache概念学习 OutputCache属性详解(一) OutputCache属性详解(二) OutputCache属性详解(三) OutputCache属性详解(四)— SqlD ...
- OutputCache属性详解(二)一 Location
目录 OutputCache概念学习 OutputCache属性详解(一) OutputCache属性详解(二) OutputCache属性详解(三) OutputCache属性详解(四)— SqlD ...
- OutputCache属性详解(三)— VaryByHeader,VaryByCustom
目录 OutputCache概念学习 OutputCache属性详解(一) OutputCache属性详解(二) OutputCache属性详解(三) OutputCache属性详解(四)— SqlD ...
- OutputCache属性详解(四)— SqlDependency
目录 OutputCache概念学习 OutputCache属性详解(一) OutputCache属性详解(二) OutputCache属性详解(三) OutputCache属性详解(四)— SqlD ...
- WPF依赖属性详解
WPF依赖属性详解 WPF 依赖属性 英文译为 Dependency Properties,是WPF引入的一种新类型的属性,在WPF中有着极为广泛的应用,在WPF中对于WPF Dependency P ...
- HTML video 视频标签全属性详解
HTML 5 video 视频标签全属性详解 现在如果要在页面中使用video标签,需要考虑三种情况,支持Ogg Theora或者VP8(如果这玩意儿没出事的话)的(Opera.Mozilla.C ...
- Android组件---四大布局的属性详解
[声明] 欢迎转载,但请保留文章原始出处→_→ 文章来源:http://www.cnblogs.com/smyhvae/p/4372222.html Android常见布局有下面几种: LinearL ...
- dede的pagelist标签的listsize数字属性详解(借鉴)
dede的pagelist标签的listsize数字属性详解.见远seo经常用织梦搭建各种网站,有次发现列表页面的分页显示超过div的界限,也就是溢出了或者说是撑破了.后来经过研究发现是pagelis ...
随机推荐
- asp.net学习视频大全(共800集)
今天在网上找asp.net学习视频时,发现了一些好的学习资源,记录一下供大家学习. 资料名称 下载地址 <ASP.NET4.0从入门到精通>随书教学视频 http://down.51ct ...
- 针对 IE的 的优化
针对 IE 的优化 有些时候,你需要对 IE 浏览器的 bug 定义一些特别的规则,这里有太多的 CSS 技巧(hacks),我只使用其中的两种方法,不 管微软在即将发布的 IE7 beta 版里是否 ...
- Android—PopupWindow的简单使用
PopupWindow 是一个可以显示在当前 Activity 之上的浮动容器,这个Demo要实现的功能是,点击布局中的两个按钮,进而控制PopupWindow的显示与消失,代码中有详细的注释首先看一 ...
- Android 自定义View之自绘控件
首先要提前声明一下,我对于自定义View的理解并不是很深,最近啃了几天guolin博主写的关于自定义View的博客,讲的非常棒,只不过涉及到源码和底层的一些东西,我自己就懵逼了,目前只是会了关于自定义 ...
- 【Linux】GCC编译
GCC简介 GCC基本用法 GCC程序产生过程 GCC编译选项 一.GCC简介 1.1 GCC特点 Gcc(GNU C Compiler)是GNU推出的功能强大.性能优越的多平台编译器,是GNU的 代 ...
- ubuntu 18 下配置 WebStorm 编译 sass
ubuntu 18 下配置 WebStorm 编译 scss 标签(空格分隔): IDE 安装Ruby: sudo apt-get install ruby ruby -v ruby 2.5.1p57 ...
- <context:property-placeholder>配置资源文件
直接在 spring 配置文件里面加上 <context:property-placeholder file-encoding="UTF-8" location=" ...
- 小于12px的字体大小在Chrome中不起作用
今天遇见一个小问题,让人挺郁闷的,在Chrome浏览器中无法把字体变成12px以下.网上搜索以下,发现无论中文英文数字在网页中CSS设置小于12px后各大浏览器均支持,在谷歌chrome浏览器不支持解 ...
- March 24 2017 Week 12 Friday
Our lives are brief, that is why it's important to search for meaning. 人生短暂,所以才要寻找它的意义. What can we ...
- Smart template的控件能否当成普通控件来用
我的同事问过我这个问题: 只要弄清楚Smart control的原理,就能回答这个问题. 答案是: smart control可以像普通的控件一样在xml view中被定义和使用,但是必须结合ODat ...