Обход jQuery — потомки

С помощью jQuery вы можете перемещаться по дереву DOM, чтобы найти потомков элемента.

Потомок — это ребенок, внук, правнук и так далее.

Переход вниз по дереву DOM

Два полезных метода jQuery для обхода дерева DOM:

Метод children()возвращает всех прямых дочерних элементов выбранного элемента.

Этот метод проходит только один уровень вниз по дереву DOM.

В следующем примере возвращаются все элементы, которые являются прямыми дочерними элементами каждого <div>элемента:

$(document).ready(function(){
$("div").children();
});

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

В следующем примере возвращаются все <p>элементы с именем класса first, которые являются прямыми дочерними элементами <div>:

$(document).ready(function(){
$("div").children("p.first");
});

Метод find()возвращает элементы-потомки выбранного элемента, вплоть до последнего потомка.

В следующем примере возвращаются все <span>элементы, являющиеся потомками <div>:

$(document).ready(function(){
$("div").find("span");
});

В следующем примере возвращаются все потомки <div>:

$(document).ready(function(){
$("div").find("*");
});

Полный обзор всех методов jQuery Traversing см. в нашем Справочнике по jQuery Traversing .