Jquery搜尋父元素操作方法_jquery

本文實例講述了Jquery搜尋父元素操作方法。分享給大家供大家參考。具體分析如下：

1. parents()方法

格式:

複製程式碼 程式碼如下:

parents([selector])

用於取得目前匹配元素集合中每個元素的祖先元素，根據需要也可以使用一個選擇器進行篩選。
如：

複製程式碼 程式碼如下:

$("p").parents().css("border" , "1px solid blue);

2. cloest方法

格式:

複製程式碼 程式碼如下:

closest(selector[, context])

該方法從元素本身開始，逐級向上級元素匹配，並返回最先匹配的元素。
如：

複製程式碼 程式碼如下:

$("a").closest("div").css( "border", "1px solid blue");

cloest()和parents()方法的主要差異如下：

① 前者從目前元素匹配查找，後者從父元素開始匹配查找

② 前者逐級向上查找，直到發現匹配的元素後就停止了，後者一直向上查找直到根元素，然後把這些元素放進一個臨時集合中，再用給定的選擇器表達式去過濾。

③ 前者回傳0或1個元素，後者可能包含0個、1個或多個元素。

3. parent()方法

格式:

複製程式碼 程式碼如下:

parent([selector])

用於取得目前目前符合元素集合中每個元素的父元素，根據需要，也可以使用一個選擇器進行篩選。

如：

複製程式碼 程式碼如下:

$("p").parent().css( "border", "1px solid blue");

4. parentsUtil()方法

格式:

複製程式碼 程式碼如下:

parentsUtil([selector])

用於取得目前🎜>用於取得目前🎜>用於取得目前🎜>用於取得目前🎜>用於取得目前🎜>用於取得目前🎜>用於取得目前🎜>用於取得目前🎜>用於取得目前🎜>用於取得目前🎜>用於取得目前。匹配元素集合中每個元素的祖先元素，直至給定選擇器匹配的元素(但不包括該元素)

如：

複製程式碼 程式碼如下:

$("li#li2").parentsUtil("# ul1_li2").css("background", "#FCF");

5. offsetParent()方法

用於搜尋第一個符合元素的已定位的父元素，僅對可見元素有效，語法格式如下：

複製程式碼 程式碼如下:

offsetParent()

此方法尋找第一個符合元素的已定位元素，並傳回由該元素包裝成的jQuery物件。

綜合例子：

複製程式碼 程式碼如下:

 
 
 
 
 
 
 
 
 
 
 

 
 

 
   
• 新聞
 
   
• 網頁
 
   
• 貼吧
 
   
• 知道
 
   
• MP3
 
   
• 圖片
 
   
• 影片
 
   
• 地圖
 
 

  

 

 
  

標題一

 
  

段落一

 
  

標題二

 
  

段落二

 
  

標題三

 
  

段落三

 

 
 
 

運作效果如下圖：

希望本文所述對大家的jQuery程式設計有所幫助。