JS dataset：获取HTML元素的自定义属性

 div id= box data-myid= 12345 data-myname= zhangsan data-mypass= zhang123 自定义数据属性 /div 

添加自定义属性之后，在 JavaScript 中可以通过元素的 dataset 属性访问自定义属性。dataset 属性的值是一个 DOMStringMap 实例，也就是一个名值对的映射。在这个映射中，每个 data-name 形式的属性都会有一个对应的属性，只不过属性名没有 data- 前缀。

浏览器支持状态：Firefox 6+ 和 Chrome。

下面代码演示了如何自定义属性，以及如何读取这些附加信息。

var div = document.getElementById( box 

//访问自定义属性值

var id = div.dataset.myid;

var name = div.dataset.myname;

var pass = div.dataset.mypass;

//重置自定义属性值

div.dataset.myid = 66666 

div.dataset.myname = zhangsan 

div.dataset.mypass = zhangsan666 

//检测自定义属性

if (div.dataset.myname) {

 console.log(div.dataset.myname);

}

虽然上述用法未获得所有浏览器支持，但是我们仍然可以使用这种方式为元素添加自定义属性，然后使用 getAttribute() 方法读取元素附加的信息。

23238.html