空元素

空元素是 HTML 中的一种元素,它不能包含任何子节点(即嵌套元素或文本节点)。空元素只有开始标签;结束标签必须不能为空元素指定。

在 HTML 中,空元素不能有结束标签。例如,<input type="text"></input> 是无效的 HTML。相反,SVG 或 MathML 元素,如果不能包含任何子节点,则可以使用结束标签而不是 XML 自闭合标签语法在其开始标签中。

HTMLSVGMathML 规范非常精确地定义了每个元素可以包含的内容。因此,某些标签组合没有语义意义。

虽然无法将空元素标记为具有任何子节点,但可以使用 JavaScript 以编程方式将子节点添加到 DOM 中的元素。但这并不是一个好的做法,因为结果将不可靠。

HTML 中的空元素如下所示

自闭合标签

自闭合标签 (<tag />) 在 HTML 中不存在。

如果 HTML 元素的开始标签中存在尾部 /(斜杠)字符,则 HTML 解析器会忽略该斜杠字符。这一点尤其重要,因为诸如 <script><ul> 之类的元素确实需要结束标签。在这些情况下,在开始标签中添加尾部斜杠不会关闭元素。相反,尾部斜杠将被忽略,并且元素将被视为打开,直到遇到明确的结束标签,或者直到解析器根据 HTML 结构和解析规则隐式关闭元素为止。例如,在 <div/>Some text 的情况下,浏览器将其解释为 <div>Some text</div>,将斜杠视为忽略,并将 div 元素视为封装后面的文本。

但是,某些代码格式化程序会在空元素的开始标签中添加尾部斜杠字符,以使其与 XHTML 兼容并更易读。例如,某些代码格式化程序会将 <input type="text"> 转换为 <input type="text" />

自闭合标签在 XMLXHTMLSVG 中的空元素中是必需的(例如,<circle cx="50" cy="50" r="50" />)。

在 SVG 和 MathML 中,不允许包含任何子节点的元素可以标记为自闭合。在这种情况下,如果元素的开始标签标记为自闭合,则该元素不能有结束标签。

注意: 如果开始标签中的尾部 /(斜杠)字符直接在未加引号的属性值之前(两者之间没有空格),则斜杠将成为属性值的一部分,而不是被解析器丢弃。例如,标记 <img src=http://www.example.com/logo.svg/> 会导致 src 属性的值为 http://www.example.com/logo.svg/ - 这会使 URL 错误。

另请参阅