tbody是否在thead之前有效？

Question

这里有一个简单的表格，其中tbody在thead之前。

虽然thead在tbody之前，但这个表格仍然可以正常工作。不过这种写法在所有现代浏览器中都有效吗？

我这样做是为了解决标题固定的问题。

<table>
  
  <tbody>
    <tr>
      <td>One</td>
      <td>Two</td>
      <td>Three</td>
    </tr>
  <tbody>
  <thead>
    <tr>
      <th>Header 1</th>
      <th>Header 2</th>
      <th>Header 3</th>
    </tr>
  </thead>
<table>

- ttmt

---

不。https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/table - Turnip

这个问题的答案已经过时，甚至可能完全错误。https://dev59.com/bKrka4cB1Zd3GeqPisFZ - Jonathan DS

Answer 1

<thead>元素在<tbody>元素之后无效。您可以在HTML5-Validator上验证您的HTML5标记。验证后，将显示此错误：

错误：在此上下文中，元素<thead>不允许作为元素<table>的子元素。
元素<thead>可以用于以下上下文:
作为<table>元素的子元素，在任何<caption>、<colgroup>元素之后，并且在任何<tbody>、<tfoot>和<tr>元素之前，但仅当没有其他是<table>元素的子元素的<thead>元素时。

还要注意<table>元素的内容模型:

按照以下顺序排列：可选的 <caption> 元素，接着是零个或多个 <colgroup> 元素，然后是可选的 <thead> 元素，接着是零个或多个 <tbody> 元素或一个或多个 <tr> 元素，最后是可选的 <tfoot> 元素，其中可以夹杂着一个或多个支持脚本的元素。

因此，在 <table> 元素内部元素的顺序很重要。

下面的 HTML 标记是有效的 HTML5：

<table>
  <thead>
    <tr>
      <th>Header 1</th>
      <th>Header 2</th>
      <th>Header 3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>One</td>
      <td>Two</td>
      <td>Three</td>
    </tr>
    <tr>
      <td>One</td>
      <td>Two</td>
      <td>Three</td>
    </tr>
    <tr>
      <td>One</td>
      <td>Two</td>
      <td>Three</td>
    </tr>
  </tbody>
</table>

注意：在这种情况下，您还可以删除关闭标签</thead>和</tbody>，因为...

如果<thead>元素直接跟着一个<tbody>或<tfoot>元素，<thead>元素的结束标签就可以省略。

(Note: 指出注意事项)

---

你可以在HTML规范中找到以上所有信息。

- Sebastian Brosch

---

你比我先回答了。我的答案基本上是一样的。我保留我的答案，因为它包含了规范的链接。如果你在你的答案中包含了这些链接，我会删除我的答案。+1（赞）给你。 - luksch

Answer 2

原始问题的HTML无效，@ttmt没有关闭标签，这使验证器认为他在标签内部有一个标签，因此目前接受的答案是错误的。 、 和 不能相互包含，但根据当前的HTML5规范，它们可以以任何给定的顺序出现在标签内。

https://html.spec.whatwg.org/multipage/tables.html#the-thead-element

- Jonathan DS

---

在链接的规范中，它说thead可以被用作“作为表元素的子元素，在任何标题、colgroup元素之后，并且在任何tbody、tfoot和tr元素之前，但仅当没有其他thead元素是表元素的子元素时。” - Tuomo Mattila