The DOM structure is actually a tree structure. The tree selector provided by jQuery can be used to select nodes in the DOM Tree. The methods of these tree selectors include: children(), parent(), parents(), next(), prev(), siblings().
Select the "children" of an element - children()
< ;li id="son1">First column
- Second column
-
$("#parent").children().length //Get the number of all "children" (li), "3 ”
$("#parent").children("#son1").text(); //Get the value of the first "child" (li) - "first column"
Select the "parent" of an element - parent()
- First column
- Second column
- Third column
$("#son1").parent().attr ("id");//Get the ID of ul - "parent"
Select the "ancestors" of a certain element -parents() (Note: Select upwards one level at a time until
- First column
- Second column
- Third column
$("#son2 ").parents().each(function(i){
if(i<3) //Only display 3 generations of ancestors
alert($(this).html());
}) ;
Select the "younger brother" of an element - next()
- First column
- Second column
- Third column
$("#son2" ).next().text(); //Select #son3 to select the "brother" of an element
prev()
- First column< ;/li>
- Second column
- Third column
< ;/ul>
$("#son2").prev().text(); //Select #son1 to select the "brothers" of an element
siblings()
< ;li id="son1">First column
- Second column
-
$("#son2").siblings().text(); //Select #son1 and #son3
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
