Цепочка селекторов jQuery :lt и :gt

У меня есть таблица с более чем 9 строками.

Если я сделаю так: $('table tr:gt(3):lt(6)'), получу ли я в конце 3 или 6 элементов и почему? Все ли селекторы применяются к одному и тому же основному выбору или последовательно применяются к разным выборам?


person glmxndr    schedule 16.07.2009    source источник


Ответы (4)


Они применяются последовательно, поэтому сначала вы отфильтруете первые четыре элемента (:gt(3)), затем вы отфильтруете все элементы после шестого (:lt(6)) элемента уже отфильтрованного набора.

Представьте себе этот HTML:

<br/><br/>
<br/><br/>
<br/><br/>
<br/><br/>
<br/><br/>
<br/><br/>

Затем выполните следующий jQuery:

$('br:gt(3):lt(6)').addClass('sel');

Теперь у вас будет:

<br/><br/>
<br/><br/>
<br class="sel"/><br class="sel"/>
<br class="sel"/><br class="sel"/>
<br class="sel"/><br class="sel"/>
<br/><br/>
person Blixt    schedule 16.07.2009
comment
Обратите внимание, что селекторы :lt(n) и :lt(n) имеют индекс 0 и не включают. - person Blixt; 16.07.2009

Вместо этого я предлагаю вам использовать метод slice().

http://docs.jquery.com/Traversing/slice#startend

$('table tr').slice(2, 5).addClass("something");
person ScottE    schedule 16.07.2009
comment
Не отвечает на вопрос, но является более четким способом выбора. - person tvanfosson; 16.07.2009
comment
Я не могу придумать причину, по которой вы связываете lt и gt таким образом, так что, возможно, субарендатор найдет это полезным. - person ScottE; 16.07.2009
comment
Да, это действительно полезно, хотя и лишь частично отвечает на вопрос. +1 однако :) - person glmxndr; 16.07.2009
comment
Почему это лучше? Если имеется 1000 строк таблицы, это приводит к выбору 1000 элементов только для того, чтобы вырезать четыре интересующих элемента. По крайней мере, в версии OP у jQuery есть возможность фильтровать во время выбора (на что я надеюсь). - person harpo; 24.04.2010
comment
@harpo jsperf.com/lt-vs-slice Я запустил это в Chrome и IE10, оба раз ломтик был быстрее. - person ToastyMallows; 23.01.2014

Не совсем то, что вы могли подумать -

Рабочая демонстрация

По сути, второй фильтр применяется последовательно к согласованному набору первого фильтра.

Например, в таблице с 10 строками :gt(3) отфильтрует элементы с 5 по 10, затем :lt(6) будет применено к 6 элементам без фильтрации.

если вы добавите /edit к демонстрационному URL-адресу, вы можете поиграть с селектором и убедиться в этом сами. Если вы измените второй фильтр на :lt(2), вы получите строки 5 и 6, выделенные красным цветом.

person Russ Cam    schedule 16.07.2009

По какой-то причине :lt(6) будет игнорироваться в этом выборе, поэтому он вернет все, что больше 3 в этом экземпляре.

Однако, если вы переключите его, он будет работать так, как ожидалось.

$('table tr:lt(6):gt(3)')

вернет 2 строки (только строки 4 и 5 находятся между 6 и 3).

** изменить: ** используя v.1.3.2

Кроме того, lt(6) не игнорируется, а не просто работает так, как я ожидал. Таким образом, :gt(3):lt(6) фактически вернет 6 элементов (если у вас достаточно строк)

person peirix    schedule 16.07.2009
comment
На образце, который я пробовал, так не сработало. Какую версию jQuery вы используете? - person tvanfosson; 16.07.2009
comment
Неправда, :lt(6) будет применено, просто вы этого не увидели, потому что :gt(3) вернуло более 6 элементов. Однако это будет работать, как вы сказали, если вы поменяете их местами. - person Blixt; 16.07.2009
comment
Ага! поэтому он фильтрует все, что больше 3, а затем выполняет новый фильтр для того, что когда-либо было получено от этого... хорошо. - person peirix; 16.07.2009