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…