html - 如何在表格中正确插入 和 ？

Question

我在网上查了没找到答案，所以才来问这个问题。

新数据将始终按照以下格式进行格式化，并填充到 id="content"

<tr>
   <td>name</td>
   <td>age</td>
   <td>gender</td>
</tr>

我读到你需要 <div>在 <td> 里面如果你要放<div>在 <table> 里面.现在，格式不正确。所有新数据都在第一列，而不是每一行。

<table>
   <tr>
      <th>name</th>
      <th>age</th>
      <th>gender</th>
   </tr>
   <td>
      <div id="contents">
         <tr>
            <td>John</td>
            <td>12</td>
            <td>male</td>
         </tr>
         <tr>
            <td>Jess</td>
            <td>13</td>
            <td>female</td>
         </tr>
      </div>
   <td>
</table>

Answer 1

更新

重新阅读您最可能需要的结构

<table>
  <thead>
   <tr>
      <th>name</th>
      <th>age</th>
      <th>gender</th>
   </tr>
  </thead>
  <tbody id="contents">
     <tr>
        <td>John</td>
        <td>12</td>
        <td>male</td>
     </tr>
     <tr>
        <td>Jess</td>
        <td>13</td>
        <td>female</td>
     </tr>
  </tbody>
</table>

---

原始答案

您不能将 tr 作为 div 的直接子级。

你需要使用表格

要么

<table>
   <tr>
      <th>name</th>
      <th>age</th>
      <th>gender</th>
   </tr>
   <td>
      <table id="contents">
       <tr>
          <td>John</td>
          <td>12</td>
          <td>male</td>
       </tr>
       <tr>
          <td>Jess</td>
          <td>13</td>
          <td>female</td>
       </tr>
      </table>
   <td>
</table>

或

<table>
   <tr>
      <th>name</th>
      <th>age</th>
      <th>gender</th>
   </tr>
   <td>
      <div id="contents">
       <table>
        <tr>
          <td>John</td>
          <td>12</td>
          <td>male</td>
        </tr>
        <tr>
          <td>Jess</td>
          <td>13</td>
          <td>female</td>
        </tr>
       </table>
      </div>
   <td>
</table>