jQuery Selectors Удаление строк таблицы, которые соответствуют двум условиям

Question

Я пытаюсь понять, какие методы используются, когда у вас есть операция, которая выполняется только при выполнении нескольких условий в jQuery. Я не знаю, является ли фильтр ответом или нет.

В моем примере у меня есть несколько таблиц на странице. Я хочу удалить строки таблицы, соответствующие двум условиям. Первое условие состоит в том, что строка не должна быть первой строкой таблицы (первый дочерний элемент таблицы). Второе условие - строка не должна иметь никакого стиля, применяемого к ней (элемент стиля не объявлен). Я запутался в нотации для сложного селектора. Сейчас я пытаюсь выйти за рамки простых селекторов.

В моем примере таблица для использования обозначена как gvBigTable. У меня есть следующее:

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

Я хочу объединить эти условия, чтобы оба они были выполнены, чтобы строка была удалена. Любая помощь приветствуется. Благодарю.

Answer 1

Вы не использовали :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>

UPDATE: согласно предложению 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]) с JQuery, чтобы удалить строки.