如何删除jQuery中特定表行下面的所有表行

Question

这是我的表:

<table>
    <tbody>
        <tr>
            <td>1</td>
        </tr>
        <tr>
            <td>2</td>
        </tr>
        <tr>
            <td class="removeFromHere">remove all below tr</td>
        </tr>
        <tr>
            <td>remove 1</td>
        </tr>
        <tr>
            <td>remove  2</td>
        </tr>
        <tr>
            <td>remove 3</td>
        </tr>
        <tr>
            <td>remove 4</td>
        </tr>
    </tbody>
</table>

我想删除下表行下面的所有表行

 <td class="removeFromHere">remove all below tr</td>

做这个的最好方式是什么

我可以删除一个如下所示的tr:

$('.removeFromHere').parent().remove();

但它只会删除以下内容:

 <td class="removeFromHere">remove all below tr</td>

如何删除特定下方的所有tr tr.

Answer 1

您可以使用nextAll()该结果.

1. 首先需要获取<tr>元素所在的元素removeFromHere
2. 然后,您可以使用nextAll()删除<tr>它旁边的所有元素.

$('.removeFromHere').closest('tr').nextAll('tr').remove();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <td>1</td>
    </tr>
    <tr>
      <td>2</td>
    </tr>
    <tr>
      <td class="removeFromHere">remove all below tr</td>
    </tr>
    <tr>
      <td>remove 1</td>
    </tr>
    <tr>
      <td>remove 2</td>
    </tr>
    <tr>
      <td>remove 3</td>
    </tr>
    <tr>
      <td>remove 4</td>
    </tr>
  </tbody>
</table>