代码之家 › 专栏 › 技术社区 › captainduh

jQuery选择器删除满足两个条件的表行

conditional-statements html-table jquery-selectors jquery javascript

captainduh · 技术社区 · 8 年前

在我的示例中,一个页面上有多个表。我想删除表中满足两个条件的行。第一个条件是行不能是表的第一行(表元素的第一个子元素)。第二个条件是行不能应用任何样式(没有声明样式元素)。我对复杂选择器的符号感到困惑。我正在尝试超越简单的选择器。

在我的示例中,要使用的表被标记为gvBigTable。我有以下几点:

$("#gvBigTable table tbody tr.not('style')").remove();
$("#gvBigTable table tbody tr.not(first-child)".remove();

我想合并这些条件,以便必须满足这两个条件才能删除行。感谢您的帮助。谢谢

1 回复 | 直到 8 年前

Community CDub 7 年前

你没有使用 :not() 正确地你可以像下面这样做。

$("table tbody tr:not(':first-child'):not('[style]')").remove();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
    <tbody>
        <tr>
            <td>111</td>
        </tr>
        <tr>
            <td>222</td>
        </tr>
        <tr style="">
            <td>333</td>
        </tr>
        <tr>
            <td>444</td>
        </tr>
    </tbody>
</table>

更新: 根据 David Thomas 纯CSS解决方案如下所示。

table tbody tr:first-child ~ tr:not([style]) { 
    display: none; 
}

<table>
  <tbody>
    <tr>
      <td>111</td>
    </tr>
    <tr>
      <td>222</td>
    </tr>
    <tr style="">
      <td>333</td>
    </tr>
    <tr>
      <td>444</td>
    </tr>
  </tbody>
</table>

如果你不想使用 display: none 然后,您可以使用选择器 table tbody tr:first-child ~ tr:not([style])

推荐文章

Martin SpruÅ¡anský · 电子邮件输入未将电子邮件地址作为新闻稿订阅框中的有效输入

7 年前

luke · jQuery中的:valid和:invalid选择器

7 年前

Ian Vink · 向有条件的儿童添加类

7 年前

LMAOman · jQuery多选择器语法

7 年前

jayjaypg22 · 在多选择器中使用变量

7 年前

feetwet · 为什么是选择器。文本获取内部函数值?

7 年前

LeBlaireau · Jquery-使用数据属性选择父项

7 年前

Dipak · 如何显示当前李的独生子女并隐藏其他李子女

7 年前

TWiStErRob · 用于表中标签同级的jQuery选择器

7 年前

ToniWidmo · 在jquery中转义select选项值

7 年前