d13*_*d13 171 html custom-element
我一直无法找到自定义标签在HTML5中是否有效的明确答案,如下所示:
<greeting>Hello!</greeting>
我没有在规范中找到任何方式:
http://dev.w3.org/html5/spec/single-page.html
并且自定义标签似乎不会使用W3C验证器进行验证.
jes*_*vin 163
在自定义元素规范是在Chrome和Opera可用,并成为提供其他浏览器.它提供了一种以正式方式注册自定义元素的方法.
自定义元素是可由作者定义的新元素DOM元素.与装饰器(无状态和短暂的)不同,自定义元素可以封装状态并提供脚本接口.
自定义元素是名为Web Components的更大W3规范的一部分,以及模板,HTML Imports和Shadow DOM.
Web组件使Web应用程序作者能够定义具有一定程度的视觉丰富性和交互性的小部件,而单独使用CSS是不可能的,并且当今的脚本库无法实现组合和重用的简便性.
但是,从Google开发者关于自定义元素v1的这篇精彩的文章中可以看出:
自定义元素的名称必须包含短划线(
-).所以<x-tags>,<my-element>和<my-awesome-app>都是合法的名称,而<tabs>和<foo_bar>则不是.这个要求是HTML解析器可以将自定义元素与常规元素区分开来的.它还确保将新标记添加到HTML时的向前兼容性.
一些资源
svi*_*gen 21
这是可能的并允许:
用户代理必须将他们不理解的元素和属性视为语义中立; 将它们留在DOM中(对于DOM处理器),并根据CSS(对于CSS处理器)对它们进行样式化,但不要从它们中推断出任何含义.
http://www.w3.org/TR/html5/infrastructure.html#extensibility-0
但是,如果您打算添加交互性,则需要使文档无效(但仍然完全正常)以容纳IE 7和8.
见http://blog.svidgen.com/2012/10/building-custom-xhtml5-tags.html(我的博客)
Alo*_*hci 15
这实际上是元素内容模型积累的结果.
该html元件可仅包含一个头元件,随后的主体元件.
该body元件可仅包含流内容,其中流内容被定义为元素: 一,缩写,地址,区域(如果它是一个图元素的后代),物品之外,音频,B,BDI,BDO,BLOCKQUOTE,BR ,按钮,画布,引用,代码,命令,datalist,德尔,详细信息,dfn,div dl,em,嵌入,字段集,图,页脚,窗体,h1,H2,H3,h5,h6,标题,hgroup, hr,i,iframe,img,input,ins,kbd,keygen,label,map,mark,math,menu,meter,nav,noscript,object,ol,output,p,pre,progress,q,ruby,s, samp,script,section,select,small,span,strong,style(如果存在scoped属性),sub,sup,svg,table,textarea,time,u,ul,var,video,wbr和Text
等等.
内容模型在任何时候都没有说"你可以在这个中添加任何你喜欢的元素",这对于自定义元素/标签来说是必要的.
Bee*_*jor 11
自定义元素和属性在HTML中有效,前提是:
x-data-例如,<x-foo data-bar="gaz"/>或<br data-bar="gaz"/>.
元素的共同惯例是x-foo; x-vendor-feature被推荐.
这可以处理大多数情况,因为很可能很少有开发人员需要注册其元素所需的所有功能.语法也足够有效和稳定.更详细的解释如下.
截至2014年,有一种新的,大大改进的方式来注册自定义元素和属性.它不适用于IE 9或Chrome/Firefox 20等旧版浏览器.但它允许您使用标准HTMLElement接口,防止冲突,使用x-*非data-*名称和非名称,并定义浏览器的自定义行为和语法以尊重.它需要一些花哨的JavaScript,详见下面的链接.
HTML5 Rocks - 在HTML中定义新元素
WebComponents.org - 自定义元素简介
W3C - Web组件:自定义元素
使用data-*自定义属性名称已经完全有效的一段时间,甚至与旧版本的HTML作品.
至于自定义(未注册)元素名称,W3C强烈建议不要使用它们,并认为它们不符合要求.但是浏览器需要支持它们,并且x-*标识符不会与未来的HTML规范冲突,并且x-vendor-feature标识符不会与其他开发人员冲突.自定义DTD可用于解决任何挑剔的浏览器.
以下是官方文档的一些相关摘录:
"适用的规范可以定义新的文档内容(例如foobar元素)[...].如果通过使用适用的规范来改变给定的符合HTML5文档的语法和语义,那么该文档仍然是符合HTML5的标准文献."
"用户代理必须将他们不理解的元素和属性视为语义中立;将它们留在DOM中(对于DOM处理器),并根据CSS(对于CSS处理器)设置样式,但不要从中推断出任何含义."
"用户代理不能随意处理不符合要求的文档;本规范中描述的处理模型适用于实现,无论输入文档是否符合要求."
"HTMLUnknownElement接口必须用于未由此规范定义的HTML元素."
W3C - HTML5:符合文档
WhatWG - HTML标准:DOM元素
Jos*_*osh 10
我想指出,"有效"一词在这种情况下可以有两种不同的含义,其中任何一种都是潜在的,有效的.
带有自定义标签的HTML文档是否应被视为有效的HTML5？ 对此的答案显然是"不".该规范准确列出了哪些标签在什么情况下有效.这就是为什么一个HTML验证不予受理,并自定义标签,或在错误的地方标准标签(比如在标题中的"IMG"标签)的文件.
是否可以跨浏览器以标准,明确定义的方式解析和呈现带有自定义标记的HTML文档？
在这里,也许令人惊讶的是,答案是肯定的.即使该文档在技术上不被认为是有效的HTML5,但HTML5规范确实指明了浏览器在看到自定义标记时应该做什么:简而言之,自定义标记的行为类似于<span>- 它没有任何意义,也没有做任何事情.默认,但它可以通过HTML设置样式并通过javascript访问.
给出反映现代页面的更新答案。
自定义标签在以下任一情况下均有效：
1）它们包含破折号
<my-element>
2）它们是嵌入的XML
<greeting xmlns="http://example.com/customNamespace">Hello!</greeting>
这假设您正在使用 HTML5 文档类型<!doctype html>
考虑到这些简单的限制，现在尽最大努力保持 HTML 标记有效是有意义的（请停止关闭诸如<img>和 之类的标签<hr>，这是愚蠢且不正确的，除非您使用 XHTML 文档类型，而您可能不需要）。
鉴于 HTML5 明确定义了解析规则，兼容的浏览器将能够处理您向其抛出的任何标签，即使它不是严格有效的。
自定义HTML元素是我一直在贡献的新兴W3标准,它使您能够使用解析器声明和注册自定义元素,您可以在此处阅读规范:W3 Web组件自定义元素规范.此外,Microsoft支持一个名为X-Tag的库(由前Mozilla开发人员编写),这使得使用Web组件变得更加容易.