2013-06-12 139 views
1

我正在使用jQuery,我有點問題。我有一堆DIV與一個特定的類,我試圖選擇其中的第一個。由於頁面佈局(長篇故事),我無法使用first-child僞類。但我可以通過將jQuery對象視爲數組來獲得相同的效果。我的問題是,這不會返回一個jQuery對象,而是一個純JavaScript對象(特別是HTMLDivElement)。jQuery選擇器不返回jQuery對象

$("#wizard div.collapsible")[0].addClass("selected"); 

由於返回的對象沒有addClass函數而失敗。如果我使用.get(0),它也會失敗。但是,這確實工作。

$($("#wizard div.collapsible")[0]).addClass("selected"); 

有沒有辦法做到這一點,而不必做雙jQuery選擇器? (不是說這是一個大問題,但它看起來有點混亂。)

+0

你也可以查看'.first()'http://api.jquery.com/first/ –

回答

7

這就是eqfirst功能做。 eq通過基於0的索引從選擇中獲取元素,而first僅從選擇中獲取第一個元素。

$("#wizard div.collapsible").eq(0).addClass("selected"); 
$("#wizard div.collapsible").first().addClass("selected"); 

有趣的是,雖然,你竟然打在最快的方式來獲得包含來自其它選擇的第一個元素一個jQuery選擇:

$($("#wizard div.collapsible")[0]).addClass("selected"); 

這不是一個偉大的方式做到這一點,因爲這是很難閱讀和性能優勢是最小的,但它最快!

+2

+1'eq()/ first()'>':first'每次 – lifetimes

+0

這裏不太在意速度,只是可讀性。但至少可以說這很有趣。 – GJK

+0

另外還沒有提到的是,'[0]'括號表示法會爲您提供**普通的javascript **元素,從中剝離jQuery。好極了,如果你不再需要jQuery了! –

2

[0]將是一個原始元素。這是正確和理想的行爲。如果要保留jQuery對象,請使用$("selector:first")$("selector").first()$("selector").eq(0)來獲取包裝在jQuery對象中的第一個元素。

+0

答案有一百萬,但我喜歡'first'僞類最好的。謝謝。 – GJK

+2

@GJK僞類是最糟糕的方式,因爲它意味着jQuery必須完成繁重的工作。瀏覽器本身並不理解':first',所以jQuery的選擇器引擎必須完成所有的工作。 – lonesomeday

+0

啊,我不知道':first'不是一個原生的CSS選擇器。那麼我可能會使用'first()'函數。謝謝。 – GJK

0

$.eq應該做的伎倆:如果選擇由多個元素共享類

$("#wizard div.collapsible").eq(0).addClass("selected"); 

,一個jQuery集合將被退回。試圖將該集合作爲數組訪問將返回一個原始對象,而$.eq已被設計爲返回一個jQuery對象,以方便您使用。

0

嘗試..

$("#wizard div.collapsible").eq(0).addClass("selected"); 

或者......第一個()

$("#wizard div.collapsible").first().addClass("selected"); 
0

當你使用$('#wizard div.collapsible')[0]時,如你所說,你返回一個普通的JS對象,因爲它是一個普通的JS對象,而不是一個jQuery對象,所以你無法對它使用jQuery方法。你可以使用雙選擇器或使用$('#wizard div.collapsible')[0].className = "selected";