ЛУЧШИЙ САЙТ ДЛЯ РАЗРАБОТЧИКОВ
×

jQuery Tutorial

jQuery HOME jQuery Intro jQuery Get Started jQuery Syntax jQuery Selectors jQuery Events

jQuery Effects

jQuery Hide/Show jQuery Fade jQuery Slide jQuery Animate jQuery stop() jQuery Callback jQuery Chaining

jQuery HTML

jQuery Get jQuery Set jQuery Add jQuery Remove jQuery CSS Classes jQuery css() jQuery Dimensions

jQuery Traversing

jQuery Traversing jQuery Ancestors jQuery Descendants jQuery Siblings jQuery Filtering

jQuery AJAX

jQuery AJAX Intro jQuery Load jQuery Get/Post

jQuery Misc

jQuery noConflict() jQuery Filters

jQuery References

jQuery Selectors jQuery Events jQuery Effects jQuery HTML/CSS jQuery Traversing jQuery AJAX jQuery Misc jQuery Properties


jQuery Traversing - Ancestors


Предком является родитель, дедушка, бабушка и дедушка, и так далее.

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


Обход дерева DOM

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

  • parent()
  • parents()
  • parentsUntil()

метод родительского () JQuery

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

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

В следующем примере возвращается прямой родительский элемент каждого элемента <span>:

Пример

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


Метод jQuery Parents ()

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

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

Пример

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

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

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

Пример

$(document).ready(function(){
    $("span").parents("ul");
});

Метод jQuery parentsUntil ()

Метод parentsUntil () возвращает все элементы-предки между двумя заданными аргументами.

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

Пример

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

Справочник на обход jQuery

Для полного обзора всех методов обхода jQuery, пожалуйста, перейдите на наш справка на обход jQuery.