jQuery итерация - метод children()
Пример
Найти все подэлементы div с классом "selected" и установить их цвет в голубой:
$("div").children(".selected").css("color", "blue");
Определение и использование
Метод .children() возвращает все прямые подэлементы выбранного элемента.
Синтаксис
.children(selector)
Параметр | Описание |
---|---|
selector | Строковое значение, содержащее выражение селектора, соответствующего элементам. |
Подробное описание
Если предоставлен объект jQuery, представляющий набор элементов DOM, метод .children() позволяет нам检索 эти элементы в DOM-дереве и создать новый объект jQuery из соответствующих элементов..find() Как и метод .children(), но последний только沿着 DOM-дерево спускается на один уровень.
Обратите внимание, что, как и большинство методов jQuery, .children() не возвращает узлы текста; если вам нужно получить все подузлы, включая текстовые и注释ные узлы, используйте .contents().
Этот метод принимает выражение селектора в качестве опционального параметра, того же типа, что и параметры, передаваемые в $(). Если применить селектор, он проверяет, соответствуют ли элементы данному выражению, чтобы отфильтровать их.
Размышляйте о странице с базовым вложенным списком:
<ul class="level-1"> <li class="item-i">I</li> <li class="item-ii">II <ul class="level-2"> <li class="item-a">A</li> <li class="item-b">B <ul class="level-3"> <li class="item-1">1</li> <li class="item-2">2</li> <li class="item-3">3</li> </ul> </li> <li class="item-c">C</li> </ul> </li> <li class="item-iii">III</li> </ul>
Если мы начнем с списка level-2, мы можем найти его подэлементы:
$('ul.level-2').children().css('background-color', 'red');
Результат этого кода заключается в том, что элементы A, B, C получают красный фон. Поскольку мы не применяем выражение селектора, возвращаемый объект jQuery содержит все подэлементы. Если применить селектор, то будут включены только соответствующие элементы.