jQuery Traversal-Ancestors

Warm reminder: Ancestor is father, grandfather, great-grandfather, etc. Descendants are children, grandchildren, great-grandchildren, etc. Siblings share the same parent.

jQuery Traversal - Ancestor

Ancestor is father, grandfather or great-grandfather, etc.

With jQuery, you can traverse up the DOM tree to find the ancestors of an element.

Traverse up the DOM tree

These jQuery methods are useful for traversing up the DOM tree:

parent()parents()parentsUntil()

jQuery parent() method

parent() method returns the direct parent element of the selected element.

This method will only traverse the DOM tree one level up.

jQuery parents() method

parents() method returns the value of the selected element All ancestor elements, all the way up to the root element of the document ().

The following example returns all ancestors of all elements

       
 body (曾曾祖父元素) 
div (曾祖父元素) 
ul (祖父元素) 
li (父元素) span 
 
 
  

jQuery parentsUntil() method

parentsUntil () method returns all ancestor elements between two given elements.