HTML5 classList使用
add:给元素添加一个指定的class
var test = document.getElementById('test');
test.classList.add('yellow');//添加一个class
test.classList.add('yellow','blue');//添加多个class
remove:从元素中删除一个指定的class
var test = document.getElementById('test');
test.classList.remove('red');
toggle:如果元素没有指定的class则执行add操作|反之执行remove操作
var test = document.getElementById('test');
test.classList.toggle('yellow')//切换class
test.classList.toggle("visible", i < 10 );//切换visible类取决于第二个参数的条件
contains:检测元素是否含有指定的class
var test = document.getElementById('test');
test.classList.contains('red'); //return true | false
HTML5 classList使用的更多相关文章
- HTML5 classList API接口
原文地址:HTML5 classList API 原文日期: 2010年07月13日 翻译日期: 2013年08月23日 当我陷入JavaScrip和JavaScript类库框架之中时,我总是有种希望 ...
- 脚本化CSS类-HTML5 classList属性
HTML元素可以有多个CSS类名,class属性保存了一个用空格隔开的类名列表.标识符class在JavaScript中是保留字,所以在JavaScript中可以用className. //如下代码设 ...
- [转]HTML5 classList API
Having thrust myself into the world of JavaScript and JavaScript Libraries, I've often wondered: Whe ...
- HTML5 classList API
Having thrust myself into the world of JavaScript and JavaScript Libraries, I've often wondered: Whe ...
- 权威指南之脚本化jquery
jqury函数 jquery()($())有4种不同的调用方式 第一种是最常用的调用方式是传递css选择器(字符串)给$()方法.当通过这种方式调用时,$()方法会返回当前文档中匹配该选择器的元素集. ...
- 使用HTML5里的classList操作CSS类
在HTML5 API里,页面DOM里的每个节点上都有一个classList对象,程序员可以使用里面的方法新增.删除.修改节点上的CSS类.使用classList,程序员还可以用它来判断某个节点是否被赋 ...
- html5新增操作类名方式 classList
如果一个元素有多个类名,要如何删除呢,jqeury提供了removeClass()这个api,如果不用插件,自己封装,可以这样 function removeClass(elm,removeClass ...
- HTML5实战与剖析之classList属性
classList属性究竟是干什么的,我们先撇下classList不管.我们考虑这么一个问题,那就是我们如何将拥有多个类名的元素中的其中一个类名删除呢?梦龙较劲脑汁儿终于想到一个实现的方法.将拥有类名 ...
- HTML5新特性:元素的classList属性与应用
在html5新增的classList之前, 操作元素的class用的是className这个属性,而如果要向jquery封装的hasClass, removeClass, addClass, togg ...
随机推荐
- bzoj 2286: [Sdoi2011]消耗战 虚树+树dp
2286: [Sdoi2011]消耗战 Time Limit: 20 Sec Memory Limit: 512 MB[Submit][Status][Discuss] Description 在一 ...
- sass报 error (Line XX: Invalid GBK character "\xE4") 的解决办法
在webstorm配置的SASS,插入中文注释报错: cmd.exe /D /C call D:\ProgramFiles\Ruby24-x64\bin\sass.bat --no-cache --u ...
- scrapy 中crawlspider 爬虫
爬取目标网站: http://www.chinanews.com/rss/rss_2.html 获取url后进入另一个页面进行数据提取 检查网页: 爬虫该页数据的逻辑: Crawlspider爬虫类: ...
- 【ybt1252】走迷宫
(还是蛮经典的一道bfs) 显然算法bfs [传送门] 算法基本上算是bfs的模板了,(模板详见[新知识]队列&bfs[洛谷p1996约瑟夫问题&洛谷p1451求细胞数量]) #inc ...
- 超详细的PDF Expert的注释功能介绍
今天,要给大家很是详细地介绍一下PDF Expert(一款专门在mac上使用的PDF阅读编辑器)的注释功能,让有点健忘的各位小伙伴们通过积极地与文本交互,从而记住更多的专业书内容. 具体使用方法请看以 ...
- 学习python的几种模块
最近在研究python写的拷屏系统,里面应用到了很多种模块,有文件操作的(shutil,os),多进程控制的(thread,threading),涉及时间的(time,datetime),数据库操作的 ...
- restore not found的错误(问题2)
最近在写gan,那么就牵扯到在一个session中加载两个图,restore的时候会有问题.如这篇文章写的(http://blog.csdn.net/u014659656/article/detail ...
- thymeleaf下拉框从后台动态获取集合数据并回显选中
今天遇到从后台集合中取出对象在前台页面下拉列表展示: <select name="signature" lay-search="" class=" ...
- ReactJS之遍历对象的方法
const obj = { channel: “wevmvmklskdosll12k;0”, index:0 }; Object.keys(obj).map(key => console.log ...
- require 4种引入方式的区别
以下四种引入方式的区别: 自己创建的包里面封装了一些方法,只是把aa文件夹放在了node_modules文件夹里,所以在引用时,不需要写上相对路径,也不能在网上下载 这是网上别人封装好了的包,下载好了 ...