AngularJS应用程序是否应该符合HTML5标准？

Question

我正在熟悉AngularJS，发现通过在你的指令前添加"data-"可以使你的模板代码符合HTML5标准。(例如，data-ng-repeat="..."而不是ng-repeat="...")。我的第一反应是将所有指令都添加上这样的前缀，但我一直在思考：有没有充分的理由这样做呢？是否有任何已确认的浏览器因无效HTML属性而出现故障的情况？在每个指令前添加"data-"变得相当繁琐，也使HTML模板可读性降低了很多。

- Andy Barron

Answer 1

属性名必须由一个或多个字符组成，这些字符不能包括空格字符、U+0000 NULL、U+0022 QUOTATION MARK（"）、U+0027 APOSTROPHE（'）、">"（U+003E）、"/"（U+002F）和"="（U+003D）字符、控制字符以及Unicode未定义的任何字符。在HTML语法中，属性名，即使是用于外部元素的属性名，也可以写成大小写混合的ASCII不区分大小写匹配属性名称的形式。

http://www.w3.org/TR/html/syntax.html#attributes-0

自定义数据属性旨在存储页面或应用程序私有的自定义数据，对于这些数据没有更合适的属性或元素。

http://www.w3.org/TR/html5/dom.html#custom-data-attribute

经过更深入的挖掘，我找到了关于data-*属性的部分。然而，它并没有明确说明这是“必须”的。更多的是“我们建议使用它”。

据我所知，浏览器不认识的属性会被忽略，但仍可以通过DOM对象的getAttribute方法和attributes属性访问。通常情况下，data-*被用来表示语义和方便性，特别是在使用dataset时。

类似地，早期版本的Angular甚至推荐指令属性名restrict作为元素名restrict的替代品，以实现IE8的兼容性。指令通常具有自定义名称，这应该表明自定义属性名称是可以接受的。

- Joseph

---

我看过很多关于在HTML中使用data-*作为存储额外语义数据的主要方式的文献。此外，官方W3C HTML5验证器会对没有前缀data-的自定义属性发出错误提示。但你说得对：这似乎不在规范中...它改变了吗？ - Andy Barron

@AndyBarron 找到了 data-* 属性的部分（只是阅读了整个文档中的一部分）。但是，它并不强制要求您使用它们。 - Joseph

规范措辞有些奇怪，但这就是答案！ - Andy Barron