jQuery - 如果在表tr中有4个td做某事

Question

我正在尝试从内部少于4 td的表中删除任何tr.

因此,例如,在此表中,我希望第二个tr消失:

HTML

<table>
  <tbdy>
    <tr>
      <td>1</td>
      <td>2</td>
      <td>3</td>
      <td>4</td>
    </tr>
    <tr>
      <td>1</td>
      <td>2</td>
      <td>3</td>
    </tr>
  </tbody>
</table>

我正在尝试这样的事情

jQuery的

if ($('table tbody tr td').length >= 4) {
  //4 i ok so do nothing
} else {
  $(this).parent("tr").remove();
}

但我无处可去.有帮助吗？

Answer 1

使用jQuery :has()选择器:not()和:nth-child()伪类选择器.

$('tr:not(:has(:nth-child(4)))').remove()

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

或者,使用filter()方法过滤掉仅包含td小于4的元素并删除.

$('tr').filter(function() {
  return $(this).children('td').length < 4;
}).remove()

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