Перейти к содержанию

Список селекторов

В этом разделе представлено описание всех возможных способов для выбора необходимого элемента, или набора элементов в документе с использованием JavaScript библиотеки jQuery.

*
Выбирает все элементы в документе (включая <html>, <head> и <body>).
$("*")
#id
Выбирает элемент, глобальный атрибут id которого, имеет значение test (элемент с определенным идентификатором).
$("#test")
.class
Выбирает элементы, глобальный атрибут class которых, имеет значение test.
$(".test")
element
Выбирает все HTML элементы <a> в документе.
$("a")
selector, selector
Выбирает все HTML элементы <i>, <b>, <em> и элементы, глобальный атрибут class которых, имеет значение test в документе.
$("i, b, em, .class")
element element
Выбирает все элементы <a>, вложенные внутри элементов <div> (селектор потомков).
$("div a")
element > element
Выбирает все дочерние элементы <strong>, у которых родитель - элемент <div> (селектор дочерних элементов).
$("div > strong")
element + element
Выбирает все элементы <p>, которые расположены сразу же после элементов <h2>.
$("h2 + p")
element ~ element
Выбирает все элементы <p>, которые следуют сразу же за элементом <h2>, а также все элементы <p>, которые находятся на одном уровне вложенности (сестринские элементы).
$("div ~ p")
:first
Выбирает первый HTML элемент <a> в документе.
$("a:first")
:last
Выбирает последний HTML элемент <a> в документе.
$("a:last")
:even
Выбирает каждый элемент с четным индексом (например: 0, 2, 4 и так далее), или другими словами выбирает каждый нечетный HTML элемент <tr> в документе (например: 1, 3, 5 и так далее).
$("tr:even")
:odd
Выбирает каждый элемент с нечетным индексом (например: 1, 3, 5 и так далее), или другими словами выбирает каждый четный HTML элемент <tr> в документе (например: 2, 4, 6 и так далее).
$("tr:odd")
:first-child
Выбирает элементы <li>, которые являются первыми дочерними элементом своего родителя.
$("li:first-child")
:first-of-type
Выбирает все элементы <p>, которые являются первыми дочерними элементами (определенного типа) своего родителя.
$("p:first-of-type")
:last-child
Выбирает элементы <li>, которые являются последними дочерними элементами своего родителя.
$("li:last-child")
:last-of-type
Выбирает все элементы <p>, которые являются последними дочерними элементами (определенного типа) своего родителя.
$("p:last-of-type")
:nth-child()
Выбирает каждый элемент <tr>, который является третьим дочерним элементом своего родительского элемента.
$("tr:nth-child(3)")
:nth-last-child()
Выбирает каждый элемент <li>, который является третьим дочерним элементом своего родительского элемента (считая от последнего дочернего элемента).
$("li:nth-last-child(3)")
:nth-of-type()
Выбирает каждый элемент <img>, который является вторым дочерним элементом своего родительского элемента.
$("img:nth-of-type(2)")
:nth-last-of-type()
Выбирает каждый элемент <img>, который является вторым дочерним элементом своего родительского элемента (считая от последнего дочернего элемента).
$("img:nth-last-of-type(2)")
:only-child
Выбор каждого элемента <a>, который является единственным дочерним элементом своего родительского элемента (нет других элементов).
$("a:only-child")
:only-of-type
Выбор каждого элемента <a>, который является единственным элементом <a> своего родительского элемента (нет других элементов <a>).
$("a:only-of-type")
:eq()
Выбирает четвертую ячейку данных (тег <td>) внутри таблицы (индекс начинается с нуля).
$("td:eq(3)")
:gt()
Выбирает все ячейки данных (тег <td>) чей индекс больше трех (индекс начинается с нуля).
$("td:gt(3)")
:lt()
Выбирает все ячейки данных (тег <td>) чей индекс меньше трех (индекс начинается с нуля).
$("td:lt(3)")
:not()
Селектор отрицания выбирает все элементы <div>, кроме тех, глобальный атрибут class которых, имеет значение test.
$("div:not(.test)")
:header
Выбирает все элементы, которые являются заголовками (от <h1> и до <h6>).
$(":header")
:animated
Выбирает все элементы, которые находятся в процессе анимации в тот момент, когда селектор используется (только для элементов анимируемых с использованием библиотеки jQuery).
$(":animated")
:focus
Определяет какой элемент находится в фокусе в данный момент.
$(":focus")
:contains()
Выбирает все элементы, которые содержат текст "Aloha"
$(":contains('Aloha')")
:has()
Выбирает все элементы <div>, которые содержат в себе элементы <h3> (в качестве дочернего элемента, либо потомка).
$("div:has(h3)")
:empty
Выбирает все элементы, которые не имеют дочерних элементов и текстовых узлов (пустые элементы).
$(":empty")
:parent
Выбирает все элементы, которые имеют по крайней мере один дочерний узел (элемент или текст).
$(":parent")
:hidden
Выбирает все элементы <div>, которые скрыты (не занимают место в документе).
$("div:hidden")
:visible
Выбирает все элементы <div>, которые являются видимыми (занимают место в документе).
$("div:visible")
:root
Выбирает элемент, который является корневым для документа.
$(":root")
:lang()
Выбирает каждый элемент <p>, глобальный атрибут lang которого, содержит значение ru.
$("p:lang(ru)")
[attribute]
Выбирает все элементы, которые имеют атрибут alt с любым значением.
$("[alt]")
[attribute='value']
Выбирает все элементы, которые имеют указанный атрибут (src) со значением logo.png.
$("[src='logo.png']")
[attribute='value'][attribute2='value2']
Выбирает все элементы, которые имеют указанные атрибуты (src и alt) со значениями этих атрибутов logo.png для первого и image для второго.
$("[src='logo.png'][alt='image']")
[attribute!='value']
Выбирает все элементы, которые не имеют указанный атрибут, либо имеют указанный атрибут (src) со значением отличным от logo.png (не равно этому значению).
$("[src!='logo.png']")
[attribute$='value']
Выбирает все элементы, значение атрибута href которых, заканчивается на .php.
$("[href$='.php']")
[attribute|='value']
Выбирает элементы, которые имеют глобальный атрибут title со значением равным ru, либо элементы, значение которых начинается с этого значения и после него сразу следует дефис (ru-anystring).
$("[title|='ru']")
[attribute^='value']
Выбирает элементы, которые имеют указанный глобального атрибут title со значением, которое начинается с eng.
$("[title^='eng']")
[attribute~='value']
Выбирает все элементы со значением глобального атрибута title, содержащего определенное слово free (слово может быть разделено пробелами).
$("[title~='free']")
[attribute*='value']
Выбирает все элементы со значением глобального атрибута title, содержащего указанную подстроку free.
$("[title*='free']")
:input
Выбирает все элементы <input>, <textarea>, <select> и <button>.
$(":input")
:text
Выбирает все элементы <input>, которые имеют атрибут type со значением text.
$(":text")
:password
Выбирает все элементы <input>, которые имеют атрибут type со значением password.
$(":password")
:radio
Выбирает все элементы <input>, которые имеют атрибут type со значением radio.
$(":radio")
:checkbox
Выбирает все элементы <input>, которые имеют атрибут type со значением checkbox.
$(":checkbox")
:submit
Выбирает все элементы <input> и <button>, которые имеют атрибут type со значением submit и элемент <button>, который не имеет атрибута type.
$(":submit")
:reset
Выбирает все элементы <input> и <button>, которые имеют атрибут type со значением reset.
$(":reset")
:button
Выбирает все элементы <input> и <button>, которые имеют атрибут type со значением button.
$(":button")
:image
Выбирает все элементы <input>, которые имеют атрибут type со значением image.
$(":image")
:file
Выбирает все элементы <input>, которые имеют атрибут type со значением file.
$(":file")
:enabled
Выбирает все элементы, которые активны (у которых не установлен логический атрибут disabled).
$(":enabled")
:disabled
Выбирает все элементы, которые не активны (у которых установлен логический атрибут disabled).
$(":disabled")
:selected
Выбирает все элементы <option>, у которых установлен логический атрибут selected.
$(":selected")
:checked
Выбирает все элементы <input>, у которых установлен логический атрибут checked (только для <input type="checkbox"> и <input type="radio">). Кроме того, выбирает элементы <option> (пункты раскрывающегося списка <select>) с логическим атрибутом selected.
$(":checked")
:target
Если идентификатор ресурса (URI) документа содержит фрагмент идентификатора элемента, то селектор выбирет элемент с подобным идентификатором (глобальный атрибут id). Например, элемент <p id="info"> будет выбран так как URI документа (https://xsltdev.ru/#info) содержит фрагмент идентификатора этого элемента.
$("p:target")