:gt() selector — jQuery

gt селекторверсия устаревшая: 3.4

Описание: Выбирает все элементы с индексом больше, чем index в наборе совпадений.

версия добавлена: 1.0jQuery( ":gt(index)" )

index: Индекс, начиная с нуля.
версия добавлена: 1.8jQuery( ":gt(-index)" )

indexFromEnd: Индекс, начиная с нуля, отсчитываемый от последнего элемента.

Начиная с jQuery 3.4, псевдокласс :gt устарел. Удалите его из ваших селекторов и отфильтруйте результаты позже, используя .slice(). Например, :gt(3) можно заменить вызовом .slice( 4 ) (предоставленный индекс нужно увеличить на единицу).

Селекторы, связанные с индексом

Выражения селекторов, связанные с индексом (включая этот селектор "больше чем"), фильтруют набор элементов, которые соответствуют выражениям, предшествующим им. Они сужают набор, основываясь на порядке элементов в этом наборе. Например, если элементы сначала выбираются с помощью селектора класса (.myclass) и возвращаются четыре элемента, эти элементы получают индексы от 0 до 3 для целей этих селекторов.

Обратите внимание, что, поскольку массивы JavaScript используют нумерацию с нуля, эти селекторы отражают этот факт. Именно поэтому $( ".myclass:gt(1)" ) выбирает элементы после второго элемента в документе с классом myclass, а не после первого. В отличие от этого, :nth-child(n) использует нумерацию с единицы для соответствия спецификации CSS.

До jQuery 1.8 селектор :gt(index) не принимал отрицательное значение для index

Дополнительные заметки:

Поскольку :gt() является расширением jQuery и не входит в спецификацию CSS, запросы, использующие :gt() , не могут воспользоваться повышением производительности, предоставляемым методом нативного DOM querySelectorAll(). Для повышения производительности в современных браузерах используйте $("your-pure-css-selector").slice(index) вместо этого.

Пример:

Придать ячейкам TD #5 и выше желтый фон, а ячейке TD #8 - красный цвет текста.

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>gt demo</title>
  <script src="https://code.jquery.com/jquery-3.7.0.js"></script>
</head>
<body>
 
<table border="1">
  <tr><td>TD #0</td><td>TD #1</td><td>TD #2</td></tr>
  <tr><td>TD #3</td><td>TD #4</td><td>TD #5</td></tr>
  <tr><td>TD #6</td><td>TD #7</td><td>TD #8</td></tr>
</table>
 
<script>
$( "td:gt(4)" ).css( "backgroundColor", "yellow" );
$( "td:gt(-2)" ).css( "color", "red" );
</script>
 
</body>
</html>

:gt() Селектор

gt селекторверсия устаревшая: 3.4

версия добавлена: 1.0jQuery( ":gt(index)" )

версия добавлена: 1.8jQuery( ":gt(-index)" )

Дополнительные заметки:

Пример:

Демо: