jQuery層級選擇器用法分析_jquery

在HTML文件中，每個元素總是處於DOM節點樹上的某個位置，文檔層次結構中元素之間總是存在於某種層級關係，如父級和子級的關係等。

1. 子元素選擇器

用來尋找在給定的父元素下尋找這個父元素下的所有子元素，語法格式：

複製程式碼 程式碼如下:

$("parent->chilid");

2. 後代元素選擇器

用於在給定的祖先元素下匹配所有的後代元素，語法格式:

複製代碼 代碼如下:

$("ancestor descendant");

3. 緊鄰同儕元素選擇器

用於匹配所有緊鄰prev元素後的next元素，語法格式:

複製程式碼 程式碼如下:

程式碼如下:

程式碼如下:

程式碼如下:$("prev next")

4. 相鄰同儕元素選擇器

用來選擇某元素後面的所有同儕元素，語法格式如下：

複製程式碼

程式碼如下: $("prev~siblings")

綜合實例：






複製代碼


代碼如下:

 
 
 
 
 
 
 
 
 
  

 

       form元素的後代input元素為:input1, input2, input3          

      

           

maindiv的子元素:id為div1

 

         

maindiv的子元素:id為div2

        

           

      
 

       maindiv的所有子元素為:div1, div2         效果圖如下圖： 希望本文所述對大家的jQuery程式設計有所幫助。