HTML5中的自定义标记命名空间实现

Question

对于我正在构建的音频播放器，我希望有一个类似于Google和Facebook用于其共享小部件的标签。例如，它可能是：

<fp:player data-type="mp3" data-href="/path/to/file.mp3" />

实现此自定义标记的最佳方法是什么，并使其在尽可能多的浏览器中有效？

Answer 1

以上链接的规范也状态，

  

用户代理必须处理他们没有的元素和属性   理解为语义中立;将它们留在DOM中（对于DOM   处理器），并根据CSS（对于CSS处理器）设置样式，   但并没有从中推断出任何意义。

如果我正确理解规范，Quentin发布的引用是指用户代理扩展。 （我认为它们意味着特殊的浏览器和浏览器插件。）用户代理不应该创建新的标签或属性。 Web开发人员可以使用他们喜欢的任何组合标记和属性。规范明确指示用户代理开发人员考虑未知标​​签和属性，并将它们包含在DOM中以及呈现页面时。

使用脚本访问它们会变得有点棘手。 IE的7和8为您添加命名空间以查找这些自定义标记，这使您的文档在技术上无效 - 但仍然完全正常运行！

见这里（我的博客）：http://blog.svidgen.com/2012/10/building-custom-xhtml5-tags.html

Answer 2

来自the HTML specification：

  

对于打算与HTML语法一起使用的标记级功能，扩展应限于“x-vendor-feature”形式的新属性，其中vendor是一个短字符串，用于标识负责扩展的供应商，feature是功能的名称。 不应创建新元素名称

所以你无法创建它并符合规范，Facebook和Google非常非常顽皮。

你似乎试图重新发明the <audio> element。所以只要使用它，扩展语言的问题就会消失。

Answer 3

观察html5shim或html5shiv如何创建新元素：https://github.com/aFarkas/html5shiv/blob/master/src/html5shiv.js

基本上你只需要document.createElement（）元素，然后你可以使用它。