自定义属性

Question

我想获得自定义属性的价值。例如，为此：

<div style="-my-data:3;" id="foo" ></div>

我想写类似的东西：

document.getElementById("foo").style.myData;

但它不起作用。我该怎么办？

Answer 1

您应该使用HTML5's custom data-* attributes代替：

<div data-myDataName="3" id="foo"></div>

---

然后，要通过JavaScript获取它，只需使用：

document.getElementById('foo').getAttribute('data-myDataName'); // '3'

---

这是小提琴：http://jsfiddle.net/c55nf/

---

P.S。即使它是HTML5的一部分，它仍然适用于旧版浏览器。它只是在HTML5中标准化。

Answer 2

使用html数据属性：

<div data-style="3" id="foo"></div>

然后使用

document.getElementById("foo").getAttribute("data-style");

检索信息

Answer 3

使用HTML custom data attributes：

<强> HTML ：

<div data-myval="3" id="foo" ></div>​

<强>的JavaScript

alert(document.getElementById("foo").getAttribute('data-myval'));​

请参阅fiddle。