如何 Jquery 仅显示此表结构中的特定 td？

Question

我不知道如何查询这个。

我有一个如下所示的表结构：

<table class="wba_main_table" align="center" border="0" cellpadding="0" cellspacing="0" width="">
      <tbody>
        <tr>
          <td style="display: none;" id="wba_logo_bg">
          </td>
        </tr>
        <tr>
          <td style="display: none;" class="line">
          </td>
        </tr>
        <tr>
          <td class="wba_topnavBG">
          <table>
          <tr><td>bla bla bla</td></tr> 
          </table>
          </td>
        </tr>
        <tr>
          <td style="display: none;" class="line">
          </td>
        </tr>
        <tr style="display: none;" class="greyBar">
          <td>
          </td>
        </tr>
        <tr>
          <td style="display: none;" class="line">
          </td>
        </tr>
        <tr>
          <td style="display: none;" class="lightGreyBar">
          </td>
        </tr>
        <tr>
             <td><table><tbody><tr><td>
                 <div id="deep_div1"></div>
             </td></tr></tbody></table></td>
        </tr>
</table>

我想要做的是隐藏所有 tr，除了包含wba_topnavBG 的那个。我的策略是使用 wba_logo_bg 作为 id 并选择父母，然后从那里选择所有没有班级 wba_topnavBG 和 hide() 的孩子 td，但我不知道如何编写选择部分。

有什么帮助吗？ :)

编辑

忘了在那个 td 里面加上另一个表结构，里面有更多的 tr 和 tds。

编辑 2

嗯，现在看来，我必须隐藏另一个 tr，其中包含一个表，该表包含一个带有 id 的 div。是否可以修改 jquery 行以添加要在其 :has 语法中查找的其他内容？

1. 我怎样才能隐藏其他 tr 除了 对于包含 div deep_div1 的那个 和一个有 td 类的 wba_topnavBG?

由于这个新的转折仍然与这个问题有关，我不想在 Stack Overflow 中创建另一个问题。

Answer 1

您可以组合 :not 和 :has 伪选择器：

$('.wba_main_table tr:not(:has(td.wba_topnavBG))').hide();

此选择器将匹配所有不包含 td 元素且类为 wba_topnavBG 的 tr 元素。

使用您的标记检查示例 here。

编辑：针对您的评论，如果您在 td 内有一个表，并且您只想选择 .wba_main_table 的直接 tr 后代，您应该使用parent > child选择器：

$('.wba_main_table > tr:not(:has(td.wba_topnavBG))').hide();