只删除tbody上的tr

Question

我有一个html，当然，它有一个表元素，在tbody中，我有一个删除表格行的按钮。

我已为该按钮分配了onclick=""功能。 (Function here)

如何只删除表格主体上的行（ tbody ），而不删除表格中的行（ thead ）？

FIDDLE HERE

Answer 1

将正文行包裹到tbody元素，而您只能选择要删除的table tbody tr。使用jQuery，您可以$('table tbody tr').remove();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="table">
  <thead>
    <tr>
      <th>Name</th>
      <th>Action</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Some content</td>
      <td>
        <button onClick="$(this).closest('tr').remove()">Remove</button>
      </td>
    </tr>

    <tr>
      <td>Some content</td>
      <td>
        <button onClick="$(this).closest('tr').remove()">Remove</button>
      </td>
    </tr>

    <tr>
      <td>Some content</td>
      <td>
        <button onClick="$(this).closest('tr').remove()">Remove</button>
      </td>
    </tr>

    <tr>
      <td>Some content</td>
      <td>
        <button onClick="$(this).closest('tr').remove()">Remove</button>
      </td>
    </tr>
  </tbody>
</table>
<button onClick="$('#table tbody tr').remove()">Remove all rows</button>