javascript - 浏览器如何处理 HTML 元素上的无效/未指定属性？

Question

例如，如果我有这个：

<div id="blah" myattribute="something">whatever</div>

我可以确保没有浏览器会忽略（从而使旧版 JavaScript 无法访问）myattribute吗？我知道这很丑陋且不标准，但非常有用。或者如果他们这样做了，jQuery 仍然能够得到它们吗？

score 5 · Accepted Answer

您应该使用data属性，它们是网络标准。

像这样：

<div id="blah" data-myattribute="something">whatever</div>

然后在jQuery中你可以这样做：

var value = $("#blah").data("myattribute");

score 4 · Accepted Answer

浏览器不会抱怨无法识别的属性，Javascript 和 jQuery 仍然可以访问它们：

console.log( $('#blah').attr('myattribute') ); // something
console.log( document.getElementById('blah').getAttribute('myattribute') ); // something

但是，您应该使用data-*专门用于自定义属性的 HTML5 属性。jQuery 有data()访问/设置它们的方法：

<div id="blah" data-myattribute="something">whatever</div>

<script>
console.log( $('#blah').data('myattribute') ); // something
</script>

score 2 · Accepted Answer

2

为什么不使用 data-attributes Data-attributes, HTML5？

于 2013-02-21T14:14:37.947 回答

score 1 · Accepted Answer

浏览器将忽略无效属性。如果您想指定自己的属性，请使用 data- 属性，因为这被认为是有效的。

关于数据属性的 w3 文档

4 回答 4