jQuery traversal

jQuery traversal

What is traversal?

jQuery traversal, meaning "move," is used to "find" (or pick) HTML elements based on their relationship to other elements. Start with a selection and move along it until you reach the element you expect.

The following image shows a family tree. W ith jQuery traversal, you can easily move up (ancestor), down (children), and horizontally (compatriot) in the family tree, starting with the selected (current) element. This movement is called traversal of the DOM.

Illustration:

• The element is the parent element of the element and is the ancestor of everything in it.
• The element is the parent element of the element and the child element of the element
• The element on the left is the parent element of the .
• The element is a child element of slt;li;gt; and is a descendant of the child of the .lt;ul> and the .lt;div.gt;
• The two elements are compatriots (with the same parent element).
• The element on the right is the parent element of the .
• The elements are the children of the right-hand side, as well as the descendants of the .lt;ul> and the slt;div.gt;

	The ancestors were fathers, grandfathers, great-grandfathers, and so on. F uture generations are children, grandchildren, great-grandchildren, and so on. Fellow citizens have the same father.

Traverse the DOM

jQuery provides a variety of ways to traverse the DOM.

The largest type of traversal method is tree traversal.

The next chapter explains how to move up, down, and at the same level in the DOM tree.