Селекторы jQuery - это строчные выражения, которые задают условия поиска и получения элементов DOM на странице сайта. Селекторы помогают находить элементы страницы по:

  • названию тега
  • имени класса элемента
  • идентификатору элемента
  • значениям атрибутов
  • содержимому элементов
  • родительским элементам
  • дочерним элементам
  • порядковому номеру элемента

Селекторы используются в двойных или одинарных кавычках. Существует множество типов селекторов jQuery:

Базовые

Значение Описание
"*" все элементы
".className" элементы с указанным классом
"#idName" элемент с указанным идентификатором
"tag" элемент с указанным названием (название тега)

Комбинированные селекторы

Значение Описание
"element1, element2" элементы, с перечисленными через запятую селекторами. Например, можно получить сразу несколько элементов с разными классами $('.page, .post');
"outer inner" элементы inner, являющиеся потомками элементов outer (находятся внутри)
"parent > child" элементы из child, являющиеся прямыми потомками элементов parent
"prev + next" элементы next, находящиеся за элементами prev
"prev ~ next" элементы next, следующие за элементами prev

Селекторы по атрибутам

Значение Описание
"[name]" элементы, содержащие атрибут name
"[name = value]" элементы, с значением атрибута name совпадающим с value
"[name != value]" элементы, у которых значение атрибута name не совпадает с value
"[name ^= value]" элементы, у которых значение атрибута name начинается с value
"[name $= value]" элементы, у которых значение атрибута name заканчивается на value
"[name *= value]" элементы, у которых значение атрибута name содержит подстроку value
"[name ~= value]" элементы, у которых значение атрибута name содержит слово value
"[name |= value]" элементы, у которых значение атрибута name имеют префикс value
"[first][second]" элементы, соответствующие всем заданным условиям на атрибуты одновременно

Фильтры

Значение Описание
":focus" элемент, находящийся в фокусе
":first" первый найденный элемент
":last" последний найденный элемент
":eq( )" элемент идущий под заданным номером среди выбранных
":not(selector)" все найденные элементы, кроме указанных в selector
":even" элементы с четными номерами позиций, в наборе элементов
":odd" элементы с нечетными номерами позиций, в наборе элементов
":gt( )" элементы с индексом превышающим n
":lt( )" элементы с индексом меньшим, чем n
":header" элементы, являющиеся заголовками (с тегами h1-h6)
":animated" элементы, которые в данный момент задействованы в анимации
":hidden" невидимые элементы страницы
":visible" видимые элементы страницы
":lang(language)" элементы, в которых указаны языки содержимого
":root" элемент, который является корневым в документе.

Фильтры по содержимому

Значение Описание
":contains(text)" элементы, содержащие текст
":empty" элементы без содержимого
":has(selector)" элементы, содержащие хотя бы один элемент из selector
":parent" непустые элементы

Фильтры дочерних элементов

Значение Описание
":first-child" элементы, расположенные первыми в своих родительских элементах
":last-child" элементы, расположенные последними в своих родительских элементах
":nth-child( )"
":nth-child-last( )"		 элементы, расположенные определенным образом в родительских элементах (четные, нечетные, идущие под заданным номером)
":only-child" элементы, являющиеся единственными потомками в своих родительских элементах
":only-of-type" элементы, единственные удовлетворяющие селектору, потомками в своих родительских элементах
":first-of-type" те из выбранных элементов, которые первыми встречаются в своих родительских элементах
":last-of-type" те из выбранных элементов, которые последними встречаются в своих родительских элементах
":nth-first-of-type( )"
":nth-last-of-type( )"		 те из выбранных элементов, которые в определенную очередь встречаются в своих родительских элементах

Фильтры элементов форм

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