（非空）自闭合标签在 HTML5 中有效吗？

Question

W3C 验证器( Wikipedia ) 不喜欢 非空 元素上的自闭合标签（那些以“ /> ”结尾的标签）。 （ 空元素 是那些可能永远不包含任何内容的元素。）它们在 HTML5 中仍然有效吗？

接受 的 void 元素的一些示例：

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

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

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

笔记：

W3C 验证器实际上接受 void self-closing 标签：作者最初遇到问题是因为一个简单的错字（ \> 而不是 /> ）；然而，一般来说，自关闭标签在 HTML5 中并不是 100% 有效，并且答案详细说明了跨各种 HTML 风格的自关闭标签的问题。

原文由 cdeszaq 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

• (Theoretically) in HTML 4 , <foo / (yes, with no > at all) means <foo> (which leads to <br /> meaning <br>> （即 <br>&gt; ）和 <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 /> 的含义 取决于元素的类型：

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

原文由 Quentin 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

自动关闭的 div 不会验证。这是因为 div 是 普通元素，而不是 void 元素。

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

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

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

*注意： 外来元素 也可以自动关闭，但我认为这不在这个答案的范围内。

原文由 Red Orca 发布，翻译遵循 CC BY-SA 4.0 许可协议