如何在JavaScript中訪問自定義html屬性？

嗨即時在這個HTML文件面臨的問題，請幫助我如何在JavaScript中訪問自定義html屬性？

我很新的這一點。

可能是我很傻，錯過了一些東西。

我已經把這裏唯一有用的來源解決請。

<!DOCTYPE html> 
<html> 
    <body id="owner_profile"> 
    <a id="buy" owner="789" token="1000" wrapper="purchase" name="oname">Hurray!</a><br> 
    <script> 
     document.write("You Have: "); 
     document.write(document.getElementById('buy').token); 
    </script> 
    </body> 
</html>

我希望它顯示令牌，但它給人不確定

結果是：

萬歲！

您有：undefined

來源

2012-09-08 MeAndMySelf

屬性和屬性之間有區別。要獲得該屬性，請使用getAttribute("token")。

許多（預定義的）屬性被映射到屬性（或者其他方式，我不知道）。因此，例如，如果您設置單元格的colSpan屬性，則還會影響其colspan屬性。

然而有時候這兩者是非常不同的。最值得注意的是，如果您在框中輸入內容，則輸入的value屬性不會更改。但是value屬性會。這意味着您始終可以使用elem.value = elem.getAttribute("value")重置文本框。

作爲一般規則，您應始終使用get/setAttribute來更改元素屬性，因爲您不能依賴屬性在那裏。

側面說明：那些「屬性」應該是數據：

<a id="buy" data-owner="789" data-token="1000" data-wrapper="purchase" name="oname">

來源

2012-09-08 04:58:40

由於它現在也正在 – MeAndMySelf

，[在大多數瀏覽器]（https://developer.mozilla.org/en-US/docs/DOM/element.dataset）你可以通過'dataset'屬性直接訪問'data-'-attributes。例如。 '的document.getElementById（ '買入'）。dataset.token'。 – katspaugh

你需要使用.getAttribute('token')，而不是.token，因爲「令牌」是不是有效的HTML屬性。

<script> 
document.write("You Have: "); 
document.write(document.getElementById('buy').getAttribute("token")); 
</script>

工作的jsfiddle：http://jsfiddle.net/AvKbn/

來源

2012-09-08 04:59:29

非常感謝它的工作 – MeAndMySelf

我會說「無效」作爲「自定義」，而不是瀏覽器如何處理它，它不會通過W3C驗證程序，但它不像它破壞任何東西。無論如何，我建議使用'data-'屬性來驗證。 –

謝謝我還在學習模式 – MeAndMySelf

如何在JavaScript中訪問自定義html屬性？

回答

相關問題