Обход jQuery — предки
С помощью jQuery вы можете пройти вверх по дереву DOM, чтобы найти предков элемента.
Предок — это родитель, дедушка и бабушка, прадедушка и так далее.
Переход вверх по дереву DOM
Три полезных метода jQuery для обхода дерева DOM:
parent()parents()parentsUntil()
Родительский () метод jQuery
Метод parent()возвращает прямой родительский элемент выбранного элемента.
Этот метод проходит только один уровень вверх по дереву DOM.
В следующем примере возвращается прямой родительский элемент каждого <span>
элемента:
Пример
$(document).ready(function(){
$("span").parent();
});
Метод родителей jQuery ()
Метод parents()возвращает все элементы-предки выбранного элемента вплоть до корневого элемента документа ( <html>).
В следующем примере возвращаются все предки всех
<span>элементов:
Пример
$(document).ready(function(){
$("span").parents();
});
Вы также можете использовать необязательный параметр для фильтрации поиска предков.
В следующем примере возвращаются все предки всех <span>элементов, которые являются <ul>
элементами:
Пример
$(document).ready(function(){
$("span").parents("ul");
});
Метод jQuery parentUntil()
Метод parentsUntil()возвращает все элементы-предки между двумя заданными аргументами.
В следующем примере возвращаются все элементы-предки между a <span>и <div>элементом:
Пример
$(document).ready(function(){
$("span").parentsUntil("div");
});
jQuery-упражнения
Справочник по обходу jQuery
Полный обзор всех методов jQuery Traversing см. в нашем Справочнике по jQuery Traversing .