JQuery is a powerful framework which provides very flexible DOM traversal methods to help us by selecting the elements. We can select the element by two ways namely random and sequential method. In simple word, we can traverse deeper into the DOM with the help of query traversing methods. Mainly traversing can be categorized in three ways. They are,

Parent traversing

The jQuery methods used for finding their parents elements are,

 .parent() selects only one element in the DOM tree.
 .parents() It will function same like parent() method but it select all the element up to the DOM tree
 .parentsUntil() It will traverse and find ancestors of each element in the current set of matched elements
 .closest(). selects the first element that matches the selector

Children traversing

. Childrent () and.Find () methods are used for finding the child elements from the selection. The main difference between these two methods depend up on how far they traversing is made.

 .Children()  Find on direct child nodes
 .find() It can traverse in to children, children of those children so on. It operate recursively.

Siblings traversing

The last traversal method is siblings. The siblings (each of two or more children or offspring having one or both parents in common; a brother or sister.)  methods traversal as the name implies by its.

.prev() It will find one element previous to selected element
.next() It will find one element next to selected element
.siblings() It will perform both the .prev and  .next operation
.nextAll() It will select all the element next to selected object

We can find previous elements by using.Prev() method & next elements with .Next (), and both with .Siblings().

Note:

  • Traversal methods do not alter/modify the objects. They’re mainly used to filter the elements of  DOM object.

Let us discuss details about all traverse method with examples in up-coming posts.

 

Keep Cool Coding…

 

Other Popular Articles