jQuery поддерживает все стандартные селекторы CSS и псевдоклассы и псевдоэлементы CSS.

Кроме того, jQuery поддерживает нестандартные селекторы (псевдоклассы). Их список с описанием приведен ниже. Под таблицами находятся примеры использования.

:first Выбирает первый найденный элемент.
:last Выбирает последний найденный элемент.
:eq(номер) Выбирает элемент идущий под заданным номером среди выбранных.
:lt(число) Выбирает элементы с номером в наборе меньшим, чем заданное число.
:gt(число) Выбирает элементы с номером в наборе превышающим заданное число.
:even Выбирает элементы с четными номерами позиций в наборе выбранных элементов.
:odd Выбирает элементы с нечетными номерами позиций в наборе выбранных элементов.
:header Выбирает заголовки (теги h1, h2, h3, h4, h5, h6).
:has(селектор) Выбирает элементы, которые содержат хотя бы один элемент по заданному селектору.
:contains(текст) Выбирает элементы, содержащие заданный текст.
:parent Выбирает элементы, являющиеся родителями (то есть непустые элементы).
:empty Выбирает элементы без содержимого (без текста и других элементов).
:animated Выбирает элементы, которые в данный момент задействованы в анимации.
:hidden Выбирает невидимые элементы страницы.
:visible Выбирает видимые элементы страницы.

Формы

:button Выбирает кнопки: тег button или инпут с типом button.
:radio Выбирает радио переключатели.
:checkbox Выбирает чекбоксы.
:text Выбирает инпуты с типом text.
:password Выбирает поля для ввода пароля.
:file Выбирает элементы, являющиеся полями загрузки файлов.
:submit Выбирает элементы, являющиеся кнопками отправки формы.
:reset Выбирает элементы, являющиеся кнопками очистки формы.
:image Выбирает элементы, являющиеся изображениями для отправки формы (input типа image).
:input Выбирает элементы формы: теги input, textarea или button.
:selected Выбирает элементы с атрибутом selected.

Как пользоваться

Рассмотрим псевдокласс :first, который позволяет выбрать первый элемент в наборе jQuery. Давайте с его помощью найдем первый <li> на странице: 

$('li:first');

Сравните со стандартным псевдоклассом :first-child: 

$('li:first-child');

С помощью :first-child мы найдем все li, которые являются первыми потомками своих родителей, а с помощью :first мы найдем первый li среди выбранных (так как выбирали мы все li, то по сути мы найдем первый li на странице).

То есть :first и другие подобные селекторы jQuery работают так: находят все элементы по заданному селектору, а затем берут первый элемент среди найденных.

Аналогичным образом работает :last, только он находит не первый элемент, а последний.

С помощью :eq мы можем выбрать элемент с любым номером в наборе, к примеру, таким образом - :eq(3) - мы выберем третий найденный элемент.

С помощью :lt и :gt можно выбирать элементы с номером, меньшим или большим заданного числа соответственно. К примеру, так - :lt(3) - мы выберем элементы с номером, меньшим трех, то есть элементы номер 2, 1 и 0.

С помощью :even и :odd можно выбирать четные и нечетные элементы в наборе.

Еще полезные селекторы jQuery

Кроме селекторов по набору элементов, jQuery предоставляет нам некоторые другие полезные вещи, которых нет в CSS.

Псевдокласс :header

Например, псевдокласс :header выбирает одновременно все заголовки от h1 до h6.

Псевдокласс :has

Псевдокласс :has выбирает элементы по их содержимому. К примеру, можно выбрать так: все абзацы, внутри которых есть теги b: 

<p>Абзац с тегом <b>b</b>.</p>
<p>Абзац с тегом <i><b>b</b></i>.</p>
<p>Абзац без b.</p>

$('p:has(b)')

Обратите внимание на то, что в примере выберется как первый абзац, так и второй, не смотря на то, что во втором абзаце тег b не лежит непосредственно внутри p, а лежит сначала в i.

Если же вам нужна непосредственная вложенность, то следует сделать так: 

<p>Абзац с тегом <b>b</b>.</p>
<p>Абзац с тегом <i><b>b</b></i>.</p>
<p>Абзац без b.</p>

$('p:has(>b)')

В этом случае будет выбран только первый абзац.

Псевдокласс :contains

Псевдокласс :contains выбирает элементы по наличию определенного текста в них.

В следующем примере мы выберем абзац, внутри которого есть слово "текст": 

<p>Слово "текст".</p>
<p>Просто абзац.</p>

$('p:contains("текст")')

С помощью :contains() элемент будет выбран, если строка присутствует непосредственно внутри него или если она находится внутри одного из его потомков.

Псевдоклассы :empty и :parent

Псевдокласс :empty позволяет выбрать все пустые элементы (в которых нету текста), а псевдокласс :parent - наоборот, все непустые (parent потому что он выбирает все элементы, являющиеся родителями).