jQuery Traversing Complete Reference
In jQuery, traversing means moving through or over the HTML elements to find, filter, or select a particular or entire element.
Syntax:
$(selector).method()
Example: This example illustrates the offsetParent() method in jQuery.
HTML
<!DOCTYPE html>
< html >
< head >
< title >The offsetParent Method</ title >
</ script >
< script >
$(document).ready(function(){
$("button").click(function(){
$("p").offsetParent().css("background-color", "green");
});
});
</ script >
< style >
#d1 {
border:1px solid black;
width:70%;
position:absolute;
left:10px;
top:50px
}
#d2 {
border:1px solid black;
margin:50px;
background-color:lightblue;
text-align:center;
}
p {
padding-left: 80px;
font-weight: bold;
}
</ style >
</ head >
< body >
< button >Submit</ button >
< div id = "d1" >
< div id = "d2" >
< p >Welcome to GeeksforGeeks!</ p >
</ div >
</ div >
</ body >
</ html >
|
Output:
jQuery Traversing Complete List:
Methods
|
Description
|
Example
|
add() |
Add elements to the existing group of elements. |
|
addBack() |
Adds the previous set of elements to the current set. |
|
children() |
Find all the children’s elements related to that selected element. |
|
closest() |
Returns the first ancestor of the selected element in the DOM tree |
|
contents() |
Returns all the direct children, including text and comment nodes for the selected element. |
|
each() |
Specify the function to run for each matched element. |
|
eq() |
Locate the selected elements directly and returns an element with a specific index. |
|
filter() |
Filter out all the elements that do not match the selected criteria and those matches will be returned. |
|
find() |
Find all the descendant elements of the selected element. |
|
first() |
Select the first element from the specified elements. |
|
has() |
Find all the elements inside the specified list of elements. |
|
is() |
Check if one of the selected elements matches the selector element. |
|
last() |
Find the last element of the specified elements. |
|
map() |
Translate all items in an array or object to a new array of items. |
|
next() |
Return the next sibling of the selected element. |
|
nextAll() |
Return all the next sibling elements of the selected element. |
|
nextUntil() |
Find all sibling elements between two given elements. |
|
not() |
Return all the element which is not matched with the selected element with the particular “id” or “class”. |
|
offsetParent() |
Find the first positioned parent element in the DOM tree. |
|
parent() |
Find the parent element related to the selected element. |
|
parents() |
Find all the parent elements related to the selected element. |
|
parentsUntil() |
Find all the ancestor elements between two given elements in a DOM tree. |
|
prev() |
Return the previous sibling element of the selected element. |
|
prevAll() |
Return all the previous sibling elements of the selected element. |
|
prevUntil() |
Find all the previous sibling elements between two given elements. |
|
siblings() |
The siblings are those having the same parent element in DOM Tree. |
|
slice() |
Select a subset of elements based on its index. |
|
Last Updated :
04 Jul, 2023
Like Article
Save Article
Share your thoughts in the comments
Please Login to comment...