如何在AngularJS中使用属性前缀"x-"和"data-"

sth*_*mps 33 angularjs angularjs-directive

我是Angular的新手并试图理解"x-"和"data-"前缀的含义.在指令文档(http://docs.angularjs.org/guide/directive)中,它说这些前缀将使指令"符合HTML验证器".这到底是什么意思?

Ben*_*esh 30

HTML5规范允许任意属性,只要它们以数据为前缀,如下所示:

<div data-myattribute=""></div>
Run Code Online (Sandbox Code Playgroud)

虽然这将是无效的HTML5:

<div myattrbute=""></div>
Run Code Online (Sandbox Code Playgroud)

有关数据属性的更多信息,请查看此处.

至于"x-"属性,我认为你的意思是"x:"属性和元素,它们特定于XHTML验证......

为了扩展这一点,如果您(由于某种原因)使用XHTML,您可以使用命名空间定义自定义属性,这样(我只是在这里总结了要点):

<html xmlns:x="http://sample.com/mynamespace">
<body>
   <div x:whatever=""></div>
   <x:mytag></x:mytag>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

其中xmlns中的URL实际上只是为了防止相似元素之间的冲突.此外,可以提供自定义元素和属性的DTD作为DOCTYPE声明的一部分进行验证.

*浏览器中的行为将随xmlns方法而变化.

总之,尽管:在过去三年中发布的大多数浏览器,或IE8 +,你都不必担心这些事情.只有在非常特殊的情况下你才会真正关心.

  • 很公平,我确实试图找到关于`x-`的更多信息,但你可以想象这个词对谷歌来说是不可能的.它主要出现在实验性浏览器功能中,如"x-moz-errormessage"和"x-webkit-speech". (2认同)

Kev*_*ler 19

来自HTML5规范:http://www.w3.org/html/wg/drafts/html/master/single-page.html

以两个字符"x-"开头的属性名称保留供用户代理使用,并且保证永远不会正式添加到HTML语言中.

也:

对于打算与HTML语法一起使用的标记级功能,扩展应限于" x-vendor-feature" 形式的新属性,其中vendor是一个短字符串,用于标识负责扩展的供应商,而feature是特征.不应创建新元素名称.使用此类扩展的属性专门允许来自多个供应商的扩展在同一元素上共存,这对于元素是不可能的.使用" x-vendor-feature"形式允许进行扩展,而不会有与未来添加到规范相冲突的风险.

  • 如果你想验证标记,我甚至会说"x-"前缀是使用angular的正确方法.这真的是数据.从W3C草案:"对于标记级功能...扩展应限于'x-vendor-feature'形式的新属性"具有x-前缀的Ng属性非常适合此描述. (2认同)
  • +1.这里的措辞似乎是指浏览器供应商而不是库/框架吗?无论如何,这对我来说比使用数据前缀更合适,因为它比您可能想要附加的数据位更加特定于框架(并且还遵循草稿的x-vendor前缀). (2认同)
  • 我同意wbyoung,法律的字母x-是为浏览器保留的,而不是扩展或框架.但是,我也认为他们应该修改法律以包含这种用法,因为'x-ng-feature'看起来像一个语义正确的约定. (2认同)