Разница между функциями jQuery parent (), parent () и closest ()

Question

Я давно пользуюсь jQuery. Я хотел использовать селектор parent(). Я также придумал селектор closest(). Не смог найти никакой разницы между ними. Есть ли? Если да, то что?

В чем разница между parent(), parents() и closest()?

Answer 1

из http://api.jquery.com/closest/

Методы .parents () и .closest () похожи в том, что они оба проходят по дереву DOM,Различия между ними, хотя и незначительные, значительны:

.closest ()

• Начинается с текущего элемента
• Перемещается вверх по дереву DOM, пока не находит совпадение для поставляемого селектора
• Возвращенный объект jQuery содержит ноль или один элемент

.parents()

• Начинается с родительского элемента
• Перемещается вверх по дереву DOM к корневому элементу документа, добавляя каждый элемент-предок во временную коллекцию;Затем он фильтрует эту коллекцию на основе селектора, если он указан
• Возвращенный объект jQuery содержит ноль, один или несколько элементов

.parent ()

• Учитывая объект jQuery, который представляет набор элементов DOM, метод .parent () позволяет нам искать по родительским элементам этих элементов в дереве DOM и создаватьновый объект jQuery из соответствующих элементов.

Примечание: Методы .parents () и .parent () похожи, за исключением того, чтопоследний путешествует только на один уровень вверх по дереву DOM.Кроме того, метод $ ("html"). Parent () возвращает набор, содержащий документ, тогда как метод $ ("html"). Parent () возвращает пустой набор.

Вот связанные темы:

• В чем разница между .closest () и .parents ('селектор')?

• https://stackoverflow.com/a/2200805/149206

Answer 2

closest() выбирает первый элемент, соответствующий селектору, вверх из дерева DOM. Начинается с текущего элемента и перемещается вверх.

parent() выбирает один элемент вверх (на один уровень вверх) дерева DOM.

parents() метод аналогичен parent(), но выбирает все соответствующие элементы вверх по дереву DOM. Начинается с родительского элемента и перемещается вверх.

Answer 3

Различия между ними, хотя и незначительные, значительны:

.closest ()

• Начинается с текущего элемента
• Перемещается вверх по дереву DOM, пока не находит соответствие для поставляемого селектора
• Возвращенный объект jQuery содержит ноль или один элемент

.parents ()

• Начинается с родительского элемента
• Перемещается вверх по дереву DOM к корневому элементу документа, добавляя каждый элемент-предок во временную коллекцию; Затем он фильтрует эту коллекцию на основе селектора, если он указан
• Возвращенный объект jQuery содержит ноль, один или несколько элементов

Из jQuery Документы

Answer 4

Существует разница между $(this).closest('div') и $(this).parents('div').eq(0)

В основном closest начало сопоставления элемента из текущего элемента, тогда как parents начало сопоставления элементов из родительского элемента (на один уровень выше текущего элемента)

See http://jsfiddle.net/imrankabir/c1jhocre/1/

Answer 5

$(this).closest('div') совпадает с $(this).parents('div').eq(0).