HTML的元素标签的六个分类

HTML5已经是过去时了。

最近的 HTML5 的标准是 HTML 5.3。它于 20211 年 1 月 28 日由 W3C 工作组发布。但是，HTML 5.3 现已退役，最新的规范被称为 HTML Living Standard。

HTML Living Standard 是 HTML（超文本标记语言）和相关 API 的不断发展的规范。它由 WHATWG（Web 超文本应用技术工作组 Web Hypertext Application Technology Working Group）开发，该工作组包括来自 Apple、Mozilla 和 Opera 的开发人员。与由 W3C（万维网联盟）实施标准化的早期 HTML 版本（例如 HTML5、HTML5.1 和 HTML5.2）不同，HTML Living Standard 现在由 WHATWG 管理和维护。这也是对行业需求变化加快，而标准滞后这一矛盾的回应。

根据WHATWG的规范，HTML的元素分为六类

它们分别是：虚空元素、模板元素、原始文本元素、可转义的原始文本元素、外部元素和普通元素。

虚空元素 (Void elements)
area, base, br, col, embed, hr, img, input, link, meta, source, track, wbr
模板元素 (The template element)
template
原始文本元素 (Raw text elements)
script, style
可转义的原始文本元素 (Escapable raw text elements)
textarea, title
外部元素 (Foreign elements)
Elements from the MathML namespace and the SVG namespace.
普通元素 (Normal elements)
所有其他允许的 HTML 元素都是普通元素。

标签用于标记元素的开始和结束。标签（tag）是指<input><textarea>，而元素（element）是指input，textarea。

原始文本、可转义原始文本和普通元素都有一个开始标签（例如：<span>）来指示它们的开始位置，以及一个结束标签（例如：</span>）来指示它们的结束位置。

某些普通元素的开始和结束标签可以省略，不能省略的，一定不能省略。

下面列子中，如果 html 元素中的第一个内容不是注释，则可以省略 html 元素的开始标签<html>。

<!DOCTYPE HTML>
<html>
  <head>
    <title>标题</title>
  </head>
  <body>
    <p>正文</p>
  </body>
</html>

虚空元素只有一个开始标签；不得为虚空元素指定结束标签。因为没有结束标签，所以开始标签和结束标签之间不能放置任何内容。

<input type=radio role=progressbar>

<hr role="cell">

外部元素必须具有开始标签和结束标签，或者标记为自闭合的开始标签。

<svg viewBox="0 0 100 100" preserveAspectRatio="xMidYMid slice" role="img">
      <title>几何形状</title>
      <linearGradient id="gradient">
        	<stop class="begin" offset="0%" stop-color="red" />
        	<stop class="end" offset="100%" stop-color="black" />
      </linearGradient>
      <rect x="0" y="0" width="100" height="100" style="fill:url(#gradient)" />
      <circle cx="50" cy="50" r="30" style="fill:url(#gradient)" />
</svg>

使用MathML的例子：

<!DOCTYPE html>
<html lang="en">
 <body>
  <p>
   <math>
    <mi>x</mi>
    <mo>=</mo>
    <mfrac>
     <mrow>
      <mo form="prefix">−</mo> <mi>b</mi>
     </mrow>
     <mrow>
      <mn>2</mn> <mo>⁢</mo> <mi>a</mi>
     </mrow>
    </mfrac>
   </math>
  </p>
 </body>
</html>

元素的内容必须放置在开始标签（在某些情况下可能是隐含的）之后和结束标签（在某些情况下可能是隐含的）之前。

模板元素可以具有模板内容，但此类模板内容不是模板元素本身的子元素。下面例子中，<template>中的 p 元素不是 DOM 中template的子元素（child）；它是元素的内容 IDL 属性返回的 DocumentFragment 的子级。

<body>
  <template id="myTemplate"><p>Something</p></template>
  <script>
   const fragment = document.getElementById('myTemplate').content.cloneNode(true);
   document.body.appendChild(fragment);
  </script>
</body>

原始文本元素可以包含文本。

可转义的原始文本元素可以具有文本和字符引用，但文本不得包含不明确的 & 符号。

互联网

科技