如果 child 的 child，则隐藏整个 <tr>

Question

我有一个table这样的

$('td:contains("label label-primary")').parent().hide();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<tbody>
  <tr>
    <td>
      <a class="pums" rel="tooltip">
        <span class="label label-primary">
          HIDE
        </span>
      </a>
    </td>
  </tr>
  <tr>
    <td>
      <a class="pums" rel="tooltip">
        <span class="label label-danger">
          SHOW
        </span>
      </a>
    </td>
  </tr>
</tbody>

我只想隐藏 table 行，其中 tr 深处的 span 具有特定的 class。在这种情况下，label label-primary.

然而，这似乎不起作用。它没有隐藏任何内容。

我在 tampermonkey 上使用它来编辑我没有编辑权限的代码的网页。

我做错了什么？

Answer 1

试试这个：

$('span').hasClass('label label-primary').parents('tr:first').hide();

Answer 2

使用jQuery:has() pseudo-class selector to check element contains at least one element that matches the specified selector. Or use has()方法过滤掉元素

$('td:has(".label.label-primary")').parent().hide();

// or
$('tr:has("td .label.label-primary")').hide();

// or using has method
$('tr').has("td .label.label-primary").hide();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <td>
        <a class="pums" rel="tooltip">
          <span class="label label-primary">
                          ble>          HIDE
                                </span>
        </a>
      </td>
    </tr>
    <tr>
      <td>
        <a class="pums" rel="tooltip">
          <span class="label label-danger">
                                    SHOW
                                </span>
        </a>
      </td>
    </tr>
  </tbody>
</table>

Answer 3

试试这个..

  $(".table td").filter(function() {
     return $('span', this).hasClass('label.label-primary');
}).hide();

Answer 4

:contains() selects 包含指定文本的所有元素。你想使用find()（https://api.jquery.com/find/) or :has() https://api.jquery.com/has-selector/到select基于selector。你还必须写“.label.label-primary”来表明它们是类.

$('td:has(.label.label-primary)').parent().hide(); OR $('td').find('.label.label-primary').parent().hide();

Answer 5

这里是一个单行解决方案，希望对您有所帮助：

$("tr > td > a").find("span[class*='label label-primary']").closest("tr").hide()

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<table>
  <tr>
    <td>
      <a class="pums" rel="tooltip">
        <span class="label label-primary">
                                    HIDE
                                </span>
      </a>
    </td>
  </tr>
  <tr>
    <td>
      <a class="pums" rel="tooltip">
        <span class="label label-danger">
                                    SHOW
                                </span>
      </a>
    </td>
  </tr>
</table>
</body>

Answer 6

我可以向您推荐这个 jquery 脚本吗？

$('td').find(".label.label-primary").closest('tr').hide();

Answer 7

给你一个解决方案

$('table tr').each(function(){
  $(this).find('span[class="label label-primary"]').hide();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<table>
  <tr>
    <td>
      <a class="pums" rel="tooltip">
        <span class="label label-primary">
          HIDE
        </span>
      </a>
    </td>
  </tr>
  <tr>
    <td>
      <a class="pums" rel="tooltip">
        <span class="label label-danger">
          SHOW
        </span>
      </a>
    </td>
  </tr>
</table>
</body>

只需遍历所有 tr，然后找到具有特定 class 的 span。

希望对您有所帮助。

如果 child 的 child，则隐藏整个 <tr>

Hide entire <tr> if child's child

html

javascript

jquery

tampermonkey