使用自定义数据属性会产生浏览器兼容性问

Question

我必须在自定义数据标签或ID之间进行选择。我想选择自定义数据标记，但我想确保它们不会导致当今使用最广泛的浏览器出现浏览器兼容性问题。

我正在使用jQuery 1.6，我的特定情况涉及我需要为几个动作引用commentId的情况。

<div data-comment-id="comment-1" id="comment-1">
   <a class="foo"></a>
</div>

在jQueryin中提取数据标签更容易：$('foo').data('commentId');

从id中提取子字符串看起来有点复杂，可能因某种原因而中断：<a id="comment-1"

这两种方法都有任何彻底的优点或致命缺陷吗？

Answer 1

我建议支持数据属性，原因如下：

• ids需要在文档范围内是唯一的。 因此，它们在可以携带的语义上受到限制
• 每个元素可以有多个数据属性

并且可能与您的情况不太相关：

• 更改ID可能会破坏idrefs

（但是，我不确定我是否完全理解您的规范，因为在jquery中提取元素id与获取数据属性一样简单：$('.foo').attr('id');）。

您可能对this browser compatibility site for web technologies感兴趣。

如果xhtml是您的问题，您可能也会对如何在xhtml中使用自定义数据属性感兴趣：请参阅here以获取有关SO的讨论，并使用here了解与xhtml兼容的方法命名空间。

希望有所帮助，

最好的问候，carsten

Answer 2

this guy表示数据属性适用于IE6。

Answer 3

以下是caniusecom的相关图表：http://caniuse.com/#feat=dataset