自定義屬性

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。