首頁 > web前端 > js教程 > jQuery中closest()函數用法實例_jquery

jQuery中closest()函數用法實例_jquery

WBOY
發布: 2016-05-16 16:21:50
原創
1477 人瀏覽過

本文實例講述了jQuery中closest()函數用法。分享給大家供大家參考。具體分析如下:

此函數從元素本身開始,逐級向上級元素匹配,並返回最先匹配的元素。
closest()函數會先檢查目前元素是否匹配,如果匹配則直接傳回元素本身。如果不符合則向上尋找父元素,一層一層往上,直到找到符合選擇器的元素。如果什麼都沒找到則回傳一個空的jQuery物件。

語法結構一:

複製程式碼 程式碼如下:
$(selector).closest(expr, context)
$(selector).closest(expr, context)


參數列表:

参数 描述
expr 用以过滤元素的表达式
context 可选。作为待查找的 DOM 元素集或者文档。

實例碼:

實例一:

複製程式碼 程式碼如下:






closest()函數-腳本之家





 
我是div
   

我是孫子p


 

 

我是兒子p



我是兄弟p




實例二:

複製程式碼 程式碼如下:






closest()函數-腳本之家





 

   

我是孫子p


 

 

我是兒子p



我是兄弟p




由於id為father的div並沒有在id為children的div之內,所以並不能將其邊框設定為紅色。

語法結構二:

複製程式碼 程式碼如下:
$(selector).closest(element)

參數列表:

参数 描述
element 用于匹配元素的DOM元素或者jQuery元素。

實例碼:

實例一:

複製程式碼 程式碼如下:






closest()函數-腳本之家





 

   

我是孫子p


 

 

我是兒子p



我是兄弟p




實例二:

複製程式碼 程式碼如下:






closest()函數-腳本之家





 

   

我是孫子p


 

 

我是兒子p



我是兄弟p




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

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板