2010-06-18 25 views
0

在jQuery的發現的例子()
(DOC的是http://api.jquery.com/find/

我不知道爲什麼我們需要它,因爲,是

$('li.item-ii').find('li') 

一樣

$('li.item-ii li') 

基本上,<li>元素中的所有<li>元素具有類item-ii

同樣

$('#id1').find(".class1 #id2") 

相同

$('#id1 .class1 #id2") 

更新:如果它們是相同的,爲什麼我們需要find()?是因爲主要是當我們需要進一步選擇一些元素的時候給一個變量中的另一個元素,所以我們可以做elementFoo.find("...")

+0

我們在回答什麼或者他們是否一樣快? – theIV 2010-06-18 02:24:20

回答

4

是的,這些是等同的。 結果是一樣的,它被稱爲descendant selector。他們的實用程序有點不同(例如使用.end(),.andSelf()等),但只是選擇元素,您會找到相同的集合。

踢,你也可以這樣做:

$('li', 'li.item-ii') 

爲了您的編輯:爲什麼我們需要它嗎?有時候,你不來選擇,簡單的例子:

$(this).find('.childElementClass') 

有你需要找到的東西相對,而不是從一個已知的選擇很多時候(可能是一個DOM元素,this,一iframe文件等)。還有很多其他的traversal functions

+0

這個和$('。childElementClass',this)不是一回事,P = – Louis 2010-06-18 03:05:27

+0

@Louis - Yup,'$(selector,context)'在內部就是'context.find(selector)',實際上'$(選擇器)'仍然是'$(document).find(selector)',只需要消除幾行直接調用'.find()'的代碼即可。 – 2010-06-18 03:09:49

+0

+1當然很好的答案:)我擔心你在「踢球」項目中給出了這樣一個糟糕的例子。除非第二個參數是回調或循環中的'this'這樣的DOM元素,否則沒有速度改進。否則,jQuery執行相同的工作量(或更多?)來執行相同的查找。我意識到這是踢球,但它仍然是一個糟糕的用例。 – 2010-06-18 04:08:29

1

它們基本上是相同的。但是,如果你已經有了你的DOM元素,它可能非常有用。例如說你已經綁定到一個div上的點擊事件,並且想要隱藏div中的所有跨度。這與$(this).find('span').hide()一樣簡單,而使用其他語法會很困難。

此外,它有時可以將您的$('li.item-ii')結果存儲在一個變量中,因爲您想要運行多個查詢(假設您想先查找它下面的li,但也想在其中找到li) 。這個語法允許你在每次你想訪問另一個可維護性更好的子元素時不復制選擇器(我相信在不重新運行基本選擇器的情況下也可能會有性能優勢,但它可能取決於用例)。

所以簡而言之,它是兩種做同樣事情的方法,但是在不同情況下它們比另一種更合適。