Summary of jQuery node traversal methods

This article mainly collects and sorts out the methods of jQuery traversing nodes, so that everyone can have a clearer understanding of jQuery traversing nodes. It is very good and has reference value. Friends who need it can refer to it. I hope it can help everyone.

1.children() method:$('p').children()---Traverse and find all child element nodes of the p element

Hello
 
 Hello Again 
您好!
 
 
And Again
 

2.next() method:$ ('p').next() --- Find adjacent sibling elements after the p element but not all sibling elements

　[Related methods]

　(1)nextAll() Method: $('p').nextAll() ---- Find all sibling elements after p

　(2)nextUntil() method:$('p').nextUntil('p' )----Find all sibling elements after p up to the p element

Hello
 
Hello Again
 
 And Again 
 

3.prev() method:$('p').prev() ----Find the adjacent elements before p Sibling elements

[Related methods include]

(1) prevAll() method: $('p').prevAll() ---- Find all sibling elements before p

　(2)prevUntil() method:$('p').prevUntil('p') --- Find all elements before p until p element

Hello
 
 Hello Again 
 
And Again
 

4.siblings( ) method: $('p').siblings()---- Find all sibling elements before and after p

5.find() method: $('p').find('span' ) ---- Find the sub-element within the p element and it is a span element

6.eq() method: $('p').eq(1) --- Find the second p element (under index The index starts from 0)

7.first() method:$('li').first() --- Get the first li element

8.last() method: $('li').last() --- Get the last li element

9.filter() method:$('p').filter('.box') --- Get the class p element named box

10.is() method:$('.box').is('p') ---- Determine whether .box is a p element

11.map() method: $('p').map(callback) --- Execute the callback function for each p

Example: Traverse the input element to obtain its value separated by "," and add it to

Values: 
 
    
 

12.hasClass() method inside the p element: $('p').hasClass('box') ---- Find p

13 with the class name box .has() method: $('p').has('span') ---- Find p elements containing span elements

14.not() method: $('p' ).not('span') ---- Find p elements that do not contain span elements

15.slice() method:$('p').slice(0,2) --- - Find the first p element to the third p element

16.offsetParent() method: $('p').offsetParent() --- Find the first positioned ancestor of the p element Element

17.parent() method:$('p').parent() ---- Returns the element collection containing the only parent node of the p element

18.parents() Method: $('p').parent() ---- Returns all ancestor nodes containing the p element (excluding the root node)

19.parentUntil() method: $('p'). parentUntil('#box') ---- Find the ancestor elements of p element until #box

20.contents() method:$('p').contents() --- Return p All child nodes within the element (including text nodes)

21.end() method:$('p').find('span').end() ---- Change the body of the statement to Return to the previous state: after finding the span element, the focus returns to the p element

 Hello, how are you? 
 

Related recommendations:

Detailed explanation of jQuery's ability to dynamically add nodes and traverse nodes

Jquery small collection of methods for traversing nodes_jquery

jQuery loop traversal to change the href of a tag

The above is the detailed content of Summary of jQuery node traversal methods. For more information, please follow other related articles on the PHP Chinese website!