全栈JavaScript之路(十八)HTML5 自定义数据属性
2014-07-08 19:44
369 查看
HTML5 规范规定,用户可以为元素 自定义非标准属性, 但是要添加 data- 前缀。
目的是为元素提供与页面渲染无关的信息、或者语义信息。这些属性名可以随意添加,只要带上前缀 data- 开头就可以。
添加属性这后可以通过 dataset 访问自定义属性,dataset 属性 是DOMStringMap 类型的实例, 也是一个 key : value 的键值对。
注册:每一个data-name 形式的属性 对应, dataset 的 name 属性。
以上面的例子来说;
可以设置自定义属生的值:
目的是为元素提供与页面渲染无关的信息、或者语义信息。这些属性名可以随意添加,只要带上前缀 data- 开头就可以。
<div id="myid" data-appid="1" data-appname="csdn"></div>
添加属性这后可以通过 dataset 访问自定义属性,dataset 属性 是DOMStringMap 类型的实例, 也是一个 key : value 的键值对。
注册:每一个data-name 形式的属性 对应, dataset 的 name 属性。
以上面的例子来说;
var div = document.getElementById("myid"); div.dataset.appid ===' 1'; //true div.dataset.appname ==='nama';//true
可以设置自定义属生的值:
div.dataset.appid = "100"
相关文章推荐
- 全栈JavaScript之路(十八)HTML5 自己定义数据属性
- html5 自定义数据属性 ,也就是 data-* 自定义属性---笔记。
- jQuery 数据 - jQuery.data() 方法和HTML 5 的自定义 data-* 属性
- method 属性 -- HTML表单数据的传送方式属性
- HTML 标签自定义属性
- Javascript得到HTML自定义属性
- html自定义属性后怎么以xml格式提取出来
- HTML 标签自定义属性
- 灵活运用html的自定义属性
- 自定义HTML标签属性
- html自定义标签属性
- 自定义html标签和表单属性
- Gentle中的数据表实体类相关自定义属性的设置和获得
- js取值 html标签自定义属性(图)
- js取值 html标签自定义属性(图)
- HTML简单的自定义属性制作tab切换
- HTML 标签自定义属性
- 自定义HTML标签属性
- js中如果无法获取某个html属性,例如自定义了一个dir属性,但获取总是为空,尝试换个词,因为可能什么关键词冲突了。
- jquery的attr方法与ie7不兼容,js获取html标签自定义属性