HTML5是否允许使用非空自闭合标签？

Question

W3C验证器（维基百科）不喜欢在非空元素上使用自闭合标签（以“/>”结尾的标签）。（空元素是那些永远不会包含任何内容的元素。）它们在HTML5中是否仍然有效？

一些被接受的空元素示例：

<br />
<img src="" />
<input type="text" name="username" />

一些被拒绝的非空元素示例：

<div id="myDiv" />
<span id="mySpan" />
<textarea id="someTextMessage" />

注意：

W3C验证器实际上接受空的自闭合标签：作者最初遇到问题是因为简单的拼写错误（使用了>而不是/>）；然而，自闭合标签在HTML5中并不完全有效，答案详细阐述了不同HTML版本中的自闭合标签问题。

Answer 1

自闭合的div将无法验证。这是因为div是一个普通元素，而不是一个空元素。

根据HTML5规范，不能包含任何内容的标签（称为空元素）可以自闭合*。这包括以下标签：

area, base, br, col, embed, hr, img, input, 
link, meta, param, source, track, wbr

上述标签上的“/”是完全可选的，因此<img/>与<img>没有区别，但<img></img>是无效的。

*注意：外部元素也可以自闭合，但我认为这不在本答案的范围内。

Answer 2

• 在理论上，HTML 4中，<foo /（是的，没有任何>）的意思是<foo>（这导致<br />的意思是<br>>（即<br>>）和<title/hello/的意思是<title>hello</title>）。我使用术语“理论上”是因为这是一个SGML规则，浏览器对其支持得非常差。支持非常少（我只在emacs-w3m中看到过它起作用），以至于规范建议作者避免使用这种语法。

• 在XHTML中，<foo />的意思是<foo></foo>。这是适用于所有XML文档的XML规则。也就是说，XHTML通常以text/html的形式提供，这（至少在历史上）由浏览器使用与以application/xhtml+xml提供的文档不同的解析器处理。W3C提供了关于XHTML作为text/html的兼容性指南。（基本上：只有在元素被定义为EMPTY（并且在HTML规范中禁止了结束标签）时，才使用自闭合标签语法）。

• 在HTML5中，<foo />的含义取决于元素的类型：

  • 对于被指定为空元素（基本上是“在HTML5之前存在的元素，被禁止包含任何内容”），结束标签是被禁止的。在开始标签的末尾加上斜杠是允许的，但没有意义。这只是对于习惯于XML的人（和语法高亮器）的语法糖。
  • 对于其他HTML元素，斜杠是一个错误，但错误恢复将导致浏览器忽略它并将标签视为常规的开始标签。这通常会导致缺少结束标签，从而使后续元素成为子元素而不是兄弟元素。
  • 外部元素（从SVG等XML应用程序导入）将其视为自闭合语法。