jQuery sub-attribute filter selector usage analysis_jquery

The example in this article describes the usage of jQuery sub-attribute filter selector. Share it with everyone for your reference. The specific analysis is as follows:

1. :first-child selector

is used to select all elements of the first child element of its parent, format:

Copy code The code is as follows:

$("selector:first-child")

For example:

Copy code The code is as follows:

$("ul:first-child").css( "text-decoration", "underline").css("color", "blue");

2. :last-child selector

is used to select all elements of the last child element of its parent, format:

Copy code The code is as follows:

$("selector:last-child")

For example:

Copy code The code is as follows:

$("ul:last-child").css( "text-decoration", "underline").css("color", "red");

3. :nth-child selector

Used to select the Nth child element or odd-even element under the parent element.

Syntax format:

Copy code The code is as follows:

$("selector:nth-child(index/even /odd/equation)");

For example:

Copy code The code is as follows:

$("ul li:nth-child(4)" ).css("color", "red");//Set the text color of the fifth element under the ul element to red, that is, the index value of the li element is 4

4. :only-chilid selector

The unique selector used to select an element

Format:

Copy code The code is as follows:

$("selector:only-chilid")

Simple example:

Copy code The code is as follows:

 
 
 
 
 
 
 
 
 
 

子元素过滤器应用实例

 
 
     
       
       
       
       
       
     
     
       
       
       
       
       
     
     
       
       
       
       
       
     
     
       
       
       
       
       
     
     
       
       
       
       
       
     
 
 

效果图如下所示：

希望本文所述对大家的jQuery程序设计有所帮助。