Селекторы

Как вы уже знаете, в качестве параметра функции $() могут быть указаны селекторы, которые являются частью стандарта CSS. Рассмотрим различные селекторы подробно.

Часто используемые селекторы

Перечислим наиболее часто используемые селекторы.

  • * — коллекция всех тегов
var n = $("*").size(); // Количество тегов
  • Тег — коллекция всех тегов, имеющих указанное имя
$("p").css("backgroundColor", "red");
// Делаем фон всех абзацев красным
  • #Идентификатор — ссылка на элемент с указанным идентификатором
$("#id1").css("backgroundColor", "red");
// Делаем фон красным для элемента с id="id1"

(Если элементов с одинаковым идентификатором несколько, то будет возвращена ссылка только на первый элемент)

  • Тег#Идентификатор — ссылка на элемент с указанным идентификатором, который расположен в определенном теге
$("p#id1").css("backgroundColor", "red");
// Делаем фон красным для абзаца с id="id1"

(Если абзацев с одинаковым идентификатором несколько, то будет возвращена ссылка только на первый абзац. Если идентификатор находится в другом теге, то он будет проигнорирован)

  • .Класс — коллекция элементов, имеющих указанный стилевой класс
$(".cls2").css("backgroundColor", "red");
// Делаем фон красным для всех элементов с class="cls2"
  • Тег.Класс — коллекция элементов, имеющих указанный стилевой класс в определенном теге
$("p.cls2").css("backgroundColor", "red");
// Делаем фон красным для всех абзацев с class="cls2"
Примечание

Если название идентификатора (или класса) содержит специальные символы (например, точку или квадратные скобки), то их необходимо экранировать двумя слешами (\\).

$("#div1\\.index\\[5\\]").html("Текст");

В этом примере мы получаем ссылку на следующий элемент.

<div id="div1.index[5]"></div>

Группирование селекторов

Если необходимо, например, применить один стиль к разным элементам, то можно указать селекторы через запятую.

$("#id1, div").addClass("newClass");

В этом примере для элемента с идентификатором id1, а также для всех тегов <div> назначается стилевой класс newClass.

Самоучитель по jQuery
Самоучитель по jQuery Учебник по jQuery 3.5.1 и AJAX в формате PDF

Помощь сайту

Yandex-деньги: 410011140483022

ПАО Сбербанк:
Счет: 40817810855006152256
Реквизиты банка:
Наименование: СЕВЕРО-ЗАПАДНЫЙ БАНК ПАО СБЕРБАНК
Корреспондентский счет: 30101810500000000653
БИК: 044030653
КПП: 784243001
ОКПО: 09171401
ОКОНХ: 96130
Скриншот реквизитов

Поиск по сайту в Яндексе