Children () method usage description of jquery traversal node

Grammar

. Children (Selector)

Parameter description

Selector string value that contains the selector expression for the matching element.

The. Children ([selector]) method returns a collection of the immediate child elements of each matching element. Notice the difference between the child element and the descendant element here.
Here selector is an optional parameter, a selector expression used to filter the child elements.
Let's take a look at the. Children () method for online demo without parameters:

Let's take a look at the. Children () method for online demo without parameters:

The code is as follows

Copy Code

<ul class= "Level1" > <li class= "jquery" >jquery <ul class= "Level2" > <li>jquery Learning </li> <li>jquery Tutorial <ul class= "Level3" > <li>jquery Basic Tutorials </li> </ul> </li> </ul> </li> <li class= "PHP" >php <ul class= "Level2" > <li>php Learning </li> <li>php Tutorials </li> </ul> </li> </ul> <input type= "button" id= "Test1" value= "Get the number of sub elements of UL with Class Level1" > <input type= "button" id= "Test2" value= "Get the number of sub elements of UL with Class Level2" > <br><span id= "Result" style= "color: #FF0000" ></span> <script> $ ("#test1"). Click (function () { $ ("#result"). HTML ($ ("Ul.level1"). Children (). length); }); $ ("#test2"). Click (function () { $ ("#result"). HTML ($ ("ul.. Level2 "). Children (). length); }); </script>

Next look at the online demo with the parameters:

code is as follows	copy code
< Style> Body {font-size:16px; font-weight:bolder;} P {margin:5px 0;} </style> <div>  <span> I am a span</span>  <p class= "selected" > I am class for selected paragraph P</p>  <div class= "selected" > I am a selected with class Div</div>  <p> I'm a paragraph with no class P</p> </div> <script> $ ("div"). Children (". Selected"). CSS ("Color", "blue"); </script>