【问题标题】:Does using custom data attributes produce browser compatibility issues?使用自定义数据属性会产生浏览器兼容性问题吗?
【发布时间】:2011-09-07 12:27:19
【问题描述】:

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

我正在使用 jQuery 1.6,我的特定场景涉及我需要为多个操作引用 commentId 的情况。

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

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

从 id 中提取子字符串似乎有点复杂,并且可能由于某种原因而中断:&lt;a id="comment-1"

这两种方法有什么明显的优点或致命的缺陷吗?

【问题讨论】:

  • 自定义数据属性在 XHTML 1 或 HTML 4 下无效,尽管这与浏览器兼容性无关 - 我相信它们(与 HTML5 的大部分内容一样)旨在工作而不会在旧浏览器中引起问题(即 IE)。

标签: html custom-attributes custom-data-attribute


【解决方案1】:

出于以下原因,我建议支持数据属性:

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

在你的情况下可能不太相关:

  • 更改 ID 可能会破坏 idrefs

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

您可能对Caniuse.com 感兴趣,这是一个针对 Web 技术的浏览器兼容性网站。

如果 XHTML 对您来说是个问题,您可能还对如何在 XHTML 中使用自定义数据属性感兴趣:请参阅here 了解关于 SO 的讨论和here 了解使用命名空间的 XHTML 兼容方法。

【讨论】:

    【解决方案2】:

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

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2010-11-17
      • 2012-06-07
      • 2014-09-12
      • 1970-01-01
      • 2015-10-29
      • 2012-11-15
      • 1970-01-01
      相关资源
      最近更新 更多