首頁  >  文章  >  web前端  >  jQuery中each()、find()、filter()等節點操作方法詳解(推薦)

jQuery中each()、find()、filter()等節點操作方法詳解(推薦)

高洛峰
高洛峰原創
2016-12-29 10:59:481812瀏覽

1.each(callback)

官方解釋:

返回值:jQuery

概述

以每一個匹配的元素作為上下文來執行一個函數。

意味著,每次執行傳遞進來的函數時,函數中的this關鍵字都指向一個不同的DOM元素(每次都是一個不同的匹配元素)。而且,在每次執行函數時,都會給函數傳遞一個表示作為執行環境的元素在匹配的元素集合中所處位置的數字值作為參數(從零開始的整數)。 回傳 'false' 將停止循環 (就像在普通的循環中使用 'break')。傳回 'true' 跳至下一個循環(就像在普通的循環中使用'continue')。

參數

callback

對於每個匹配的元素所要執行的函數

示例

描述:

示例


注意:此處 this 指涉的是 DOM 物件而非 jQuery 物件。


HTML 程式碼: 

jQuery中each()、find()、filter()等節點操作方法詳解(推薦)jQuery中each()、find()、filter()等節點操作方法詳解(推薦)

jQuery 程式碼:

$("img").each(function(i){
this.src = "test" + i + ".jpg";
});

   

.find(expr|obj|ele)

官方解釋:


回傳值:jQuery


概述


搜尋所有與指定表達式相符的元素。這個函數是找出正在處理的元素的後代元素的好方法。

所有搜尋都依賴jQuery表達式來完成。這個表達式可以使用CSS1-3的選擇器語法來寫入。

參數


expr String 

用於尋找的表達式

jQuery object object
一個用於匹配元素的jQuery物件

element

從所有的段落開始,進一步搜尋下面的span元素。與$("p span")相同。


HTML 程式碼:


Hello, how are you?

jQuery 代碼:

[ <img src="test0.jpg" />, <img src="test1.jpg" /> ]

   Hello ] 


3.filter(expr|obj|ele|fn)


官方解釋:


概述

篩選出與指定表達式匹配的元素集合。

這個方法用來縮小匹配的範圍。用逗號分隔多個表達式

參數 


expr String

字串值,包含供符合目前元素集合的選擇表達式。
jQuery object object

現有的jQuery對象,以符合目前的元素。

element Expression
一個用來匹配元素的DOM元素。 

function(index) Function

一個函數用來作為測試元素的集合。它接受一個參數index,這是元素在jQuery集合的索引。在函數, this指的是當前的DOM元素。

範例


參數selector描述:


保留有select類別的元素


HTML 程式碼:

$("p").find("span")



HTML 程式碼:

<p>Hello</p><p>Hello Again</p><p class="selected">And Again</p>





結果:


[

And Again

]

以上所述是小編給大家介紹的jQuery中each()、find()和filter()等節點操作方法詳解(推薦)的相關知識,希望對大家有幫助,如果大家有任何疑問請給我留言,小編會及時回覆大家的。在此也非常感謝大家對PHP中文網的支持!


更多jQuery中each()、find()和filter()等節點操作方法詳解(推薦)相關文章請關注PHP中文網!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn