使用非标准的HTML属性被认为是不良实践吗?

16

我觉得设置任意属性非常方便,例如:

<a stackoverflowId="123">...</a>

而在 JavaScript 中:

var soId = $selectofA.attr('stackoverflowId'); //jQuery

这是一个好的实践吗?我还没有遇到过任何问题。


也许如果您描述一下您需要这个的原因,我们可以建议解决方法。严格来说答案应该是“不行”,但总有一些特殊情况看起来需要打破规则。 - Vincent Ramdhanie
3
我认为可以打破“规则”的情况不仅仅局限于极少数情况。 - AnthonyWJones
1
这是一个常见问题解答:http://stackoverflow.com/search?q=custom+html+attribute - dreftymac
4个回答

18

在 HTML 5 中,您可以使用 data-* 属性来实现此操作:

<a id="myDiv" data-stackoverflowId="123">...</a>

由于您正在使用jQuery,您可能还想检查jQuery Metadata插件。它将允许您在类属性中存储和解析JSON元数据,而您的标记仍将验证。

您可以像这样插入元数据:

<a class="your_class {stackoverflowId: '123'}">...</a>

并按照以下方式提取:

var data = $selectofA.metadata();

事实上,我并不太关心HTML5,但是我更在意它与浏览器的兼容性以及开销(因此最好使用较少的插件)。 - user198729
4
如果你想兼容当前的浏览器,那么你正在做的事情将在所有流行的浏览器中起作用...然而使用有效的标记语言可能会帮助你保持与当前和未来浏览器的兼容性。 - Daniel Vassallo
5
说真的,采用元数据方法是雪上加霜吗?我们现在有一个属性值用于类别,根据HTML和XHTML规范,它可能是CDATA,但这与大多数浏览器期望的类名或类名列表相去甚远。我不确定这是否会干扰类属性的正常行为,因此我不会把我的饼干压在这个上面。 - Roland Bouman
如果您想要这种简单的访问方式,请改用 Dataset 插件,这样您仍然可以使用 data- 属性而不会混淆类名。我们现在在规范中有了一种有效的方法来实现这一点 - 让我们不要使用类名,谢谢。http://orangesoda.net/jquery.dataset.html - Matchu

8

4
+1 这是 HTML5 组承认人们已经这样做了,因此我们最好标准化它。这比目前人们大量重载 class 属性要好。 - Gabe Moothart
参见:http://ajaxian.com/archives/custom-dom-attributes-vs-class-css-styles - dreftymac

1

我经常这样做,效果很好。使用这种技术从未遇到过任何问题。不过,像一些答案中建议的那样使用 data- 前缀也不是个坏主意。

如果你真的很担心标准兼容性,你可以以符合标准的方式编写 HTML,并在脚本中设置 DOM 上的属性。至少,文档将会验证。但由于最终结果是相同的,你必须非常痴迷才会选择这种方法,而不是 IMO 自然地扩展适合你的 HTML 的方式。

另一种方法是编写自定义 DTD,定义您想要使用的确切扩展。该方法在此处详细描述:http://www.alistapart.com/articles/customdtd/

基本上,这种方法依赖于在某个位置放置修改后的 XHTML DTD 的副本,并使用指向该自定义 DTD 的 doctype。您将在该修改后的 DTD 中定义额外的属性声明,显然,w3c 验证器实际上将使用该 DTD 进行验证。

然而,我不会在正常的面向互联网的网站上使用这种方法。我担心一些浏览器可能会尝试根据我的DTD验证文档,但最终在中途出现错误。这种自定义DTD技术并不是很普及,我不会冒险用于常规网页。


1

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接