Выборщики jQuery

Основные концепции jQuery заключаются в «выборе некоторых элементов и обработке их».

Селекторы jQuery позволяют вам «найти» (или выбрать) HTML-элементы на веб-странице.

jQuery поддерживает большинствоСелекторы CSS3и некоторые нестандартные селекторы.

Все селекторы в jQuery начинаются с символом доллара и скобок: $().

Элементные селекторы

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

Вы можете выбрать все<p>элементы, как показано ниже:

$("p")

Когда пользователь нажимает на кнопку, следующий код jQuery выберет и выделит все<p>Элементы:

$("document").ready(function() {
　　$("button").click(function() {
　　　　$("p").css("background-color", "yellow");
　　);
);

#id селекторы

jQuery #idСелекторы используют HTML-тегиатрибут idчтобы найти определенный элемент.

ID элемента в странице должно быть уникальным, поэтому селекторы ID используются для выбора уникального элемента.

Чтобы найти элемент с определенным ID, напишите символ числа (#) после которого следует ID HTML-элемента:

$("#demo")

Когда пользователь нажимает на кнопку, следующий код jQuery выберет и выделит элемент с id="demo":

$("document").ready(function() {
　　$("button").click(function() {
　　　　$("#demo").css("background-color", "yellow");
　　);
);

.class селекторы

jQuery .classСелекторы ищут элементы с определенным классом.

Чтобы найти элемент с определенным классом, напишите точку (.) после которой следует имя класса:

$(".demo")

Когда пользователь нажимает на кнопку, следующий код jQuery выберет и выделит все элементы с классом="demo":

$("document").ready(function() {
　　$("button").click(function() {
　　　　$(".demo").css("background-color", "yellow");
　　);
);

Множественные селекторы

Вы можете выбирать несколько селекторов по мере необходимости. Просто разделяйте селекторы запятыми.

Множественные селекторы выбирают все комбинированные результаты指定的 селекторов:

$("selector1, selector2, selectorN")

Следующий код jQuery выберет каждый<h2>,<div>и<span>Элементы:

$("document").ready(function() {
　　$("h2, div, span").css("background-color", "lightgreen");
);

Это полезно, когда вы хотите выполнить одну и ту же операцию для различных выборок.

Примеры выборок jQuery

jQuery предоставляет различные методы для выбора конкретных HTML-элементов.

Референтное руководство по выборщикам jQuery

Для получения полной информации о выборщиках, пожалуйста, посетите нашРеферентное руководство по выборщикам jQuery.