пример
Возврат всех предков элементов <span> :
$(document).ready(function(){
$("span").parents().css({"color":
"red", "border": "2px solid red"});
});
Результат:
body (great-great-grandparent)
div (great-grandparent)
ul (grandparent)
- li (direct parent)
span
Попробуй сам " Определение и использование
parents() метод возвращает все предку элементы выбранного элемента.
Предком является родителем, дедушкой, пра-прародитель, и так далее.
DOM дерево: Этот метод обхода вверх от родительского элемента вдоль предков элементов DOM, вплоть до корневого элемента документа (<html>) .
Примечание: Если параметр фильтра пуст, эта функция будет выбрать все предки набора элементов, от прямого родителя и весь путь до <body> и <html> . Поэтому часто бывает полезно передать выражение селектора сузить результаты поиска.
Этот метод похож на closest() , в том , что оба они пересекают вверх по дереву DOM. Различия заключаются в следующем:
parents()
- Начинается с родительским элементом
- Путешествия вверх по дереву DOM и возвращает всех предков, который соответствует переданному выражению
- Возвращаемый объект JQuery содержит ноль или более одного элемента
closest()
- Начинается с текущего элемента
- Путешествия вверх по дереву DOM и возвращает первый предок, который соответствует переданному выражению
- Возвращаемый объект JQuery содержит ноль или один элемент
Другие родственные методы:
- parent() - возвращает прямой родительский элемент выбранного элемента
- parentsUntil() - возвращает все элементы предка между двумя заданными аргументами
Синтаксис
$(selector).parents( filter )| параметр | Описание |
|---|---|
| класс =фильтр"notranslate" | Необязательный. Задает выражение селектора, чтобы сузить поиск предков Примечание: Для того, чтобы вернуть несколько предков, отделить каждое выражение с запятой. |
Попробуйте сами - Примеры
Сужая поиск
Как использовать параметр фильтра для возврата всех предков <span> , которые <ul> элементов.
Возвращение нескольких предков
Как использовать параметр фильтра для возврата всех предков <span> , которые <li> и <div> элементов.
Показать предки элемента по именам тегов
Демонстрация , которая показывает , кто предки в <span> элемент на самом деле.