DOM扩展之 HTML5
11.3.1 与类相关的扩充
2. classList属性
在操作类名时,需要通过className属性添加,删除和替换类名。因为className是一个字符串,所以即使只修改一部分内容也要设置整个字符串的值。
如<div class="user name age"></div> 则其className 为"user name age"。
HTML5新增了一种操作类名的方式,即为所有元素添加了classList属性。classList属性是新集合类型DOMTokenList的实例。 与其他DOM集合类似,DOMTokenList有一个表示自己有多少元素的length属性,
取得每个元素可以使用item()方法,也可以使用方括号语法。
新类型还定义如下方法:
- add(value)
- contains(value)
- remove(value)
- toggle(value)
如: div.classList.remove("user")
11.3.5 自定义数据属性
HTML5规定可以为元素添加自定义属性,格式是 data-**的形式,目的是为元素提供与渲染无关的信息,或者提供语义信息。
如:<div id="mydiv" data-user="42342324"></div>
添加之后,可以通过元素的dataset属性来访问自定义属性的值。dataset属性的值是DOMStringMap的一个实例,也就是一个名值对映射。在这个映射中每一个data-**形式的自定义属性都有一个对应的映射,只不过属性名没有data-前缀。
var user =document.getElementById('#mydiv').dataset.user; //42342324
DOM扩展之 HTML5的更多相关文章
- DOM扩展之HTML5 插入标记
11.3.6 插入标记 当需要在文档中插入大量的HTML标记时,通过DOM操作就会是非常麻烦的,相对而言,使用插入标记的技术,直接插入HTML字符串不仅简单而且更快.以下插入标记相关的DOM操作已经纳 ...
- HTML5部分新标签属性及DOM扩展元素
HTML5定义了一系列新元素,如新语义标签.智能表单.多媒体标签等. 我们日常讨论的H5其实是一个泛称,它指的是由HTML5 + CSS3 + Javascript等技术组合而成的一个应用开发平台. ...
- HTML5学习笔记(二十四):DOM扩展
DOM扩展 DOM标准扩展最开始都是来自各个浏览器的自定义扩展DOM的功能,后被收录为标准的DOM相关API. 本笔记只记录被各大浏览器支持的标准扩展,对于特定浏览器的专有扩展不讨论. 选择符API ...
- DOM扩展-Selectors API(选择符 API)、元素遍历
DOM扩展 对DOM的两个主要扩展是SelectorsAPI(选择符API)和HTML5 SelectorsAPI(选择符API)是由W3C发起制定的一个标准,致力于浏览器原生支持CSS查询,Sele ...
- dom扩展
第十一章 DOM扩展 一.选择符API 1.querySelector()方法 接收一个CSS选择符,返回与该模式匹配的第一个元素,如果没有找到匹配的元素,返回null. 2. ...
- DOM扩展札记
Selector API HTML5 DOM扩展 Element Traversal规范 Selector API 众多JavaScript库中,最常用的一个功能就是根据css选择符选择与某个模式匹配 ...
- 11. javacript高级程序设计-DOM扩展
1. DOM扩展 1.1 选择符API l querySelector() 接收一个css选择符,返回与该模式匹配的第一个元素 l querySelectorAll() 接收一个css选择符,返回所有 ...
- js-DOM,DOM扩展
DOM: 1. 了解节点的信息:nodeName(属性的标签名),nodeValue两个属性 在取得信息之前要进行判断是不是节点,节点类型由12个数值常量进行表示 2.每个节点都有一个childNod ...
- 《JAVASCRIPT高级程序设计》DOM扩展
虽然DOM为XML及HTML文档交互制定了一系列的API,但仍然有几个规范对标准的DOM进行了扩展.这些扩展中,有很多是浏览器专有的,但后来成了事实标准,于是其他浏览器也提供了相同的实现:浏览器开发商 ...
随机推荐
- Javascript优化后的加减乘除(解决js浮点数计算bug)
function add(a, b) { var c, d, e; try { c = a.toString().split(".")[1].length; } catch (f) ...
- Java源文件编译成功但是运行时加载不到文件
最近系统重装了一些,Java等环境变量都需要重新配置,配置好以后编写了一个Java源文件编译了一下,通过Javac编译源文件,编译成功,但是再通过Java运行时没找到报出找不到加载文件或者加载文件不存 ...
- [mobile开发碎碎念]手机页面上显示PDF文件
demo:http://mozilla.github.io/pdf.js/web/viewer.html 项目地址:https://github.com/mozilla/pdf.js <scri ...
- 有用的css片段
1.背景渐变动画 CSS中最具诱惑的一个功能是能添加动画效果,除了渐变,你可以给背景色.透明度.元素大小添加动画.目前,你不能为渐变添加动画,但下面的代码可能有帮助.它通过改变背景位置,让它看起来有动 ...
- 记一次log4j日志文件输出错误的解决
log4j错误信息:log4j:ERROR Failed to rename [D:/logs/wmts_] to [D:/logs/wmts_2015-12-21.log ]. 起因:部门网站使用B ...
- Webstorm 下的Angular2.0开发之路
人一旦上了年纪,记忆力就变得越来越不好. 最近写了许多的博文,倒不是为了给谁看,而是方便自己来搜索,不然一下子又忘记了. 如果恰巧帮助到了你,也是我的荣幸~~~~~~~~~~~~ 废话不多说,看正题~ ...
- 关于链接到QQ客服的问题,原来只需要在a标签上加一串话而已呐~~~~
<a class="btn" target=blank href=tencent://message/?uin=&Site=www.woyouli.com&M ...
- 配置 Windows 下的 nodejs C++ 模块编译环境
根据 node-gyp 指示的 Windows 编译环境说明, 简单一句话就是 "Python + VC++ 编译环境". 所有需要的安装文件, 我都下载好放到百度云盘了: nod ...
- java动手动脑和课后实验型问题第四讲
1.完全"手写代码实现"随机数生成 动手动脑: 编写一个方法,使用以上算法生成指定数目(比如1000个)的随机整数. Modulus=231-1=int.MaxValue Mult ...
- Redis设计与实现(一~五整合版)【搬运】
Redis设计与实现(一~五整合版) by @飘过的小牛 一 前言 项目中用到了redis,但用到的都是最最基本的功能,比如简单的slave机制,数据结构只使用了字符串.但是一直听说redis是一个很 ...