8、siblings
這個函數選擇一組元素的所有兄弟姐妹,傳遞一個表達式可以篩選結果。
看看這個例子:
- 誰是第一個star的兄弟節(jié)點?其它的四個,對不?
- 如圖所示,“odd”的節(jié)點被選中。索引是從零開始的,看看下面star的紅色數字。
9、prev & prevAll
prev()函數選擇前一個兄弟節(jié)點。prevAll()選擇一個元素集合前面所有的兄弟節(jié)點。 如果你正在構建一個星級部件,這將相當方便。第三個star前面的兄弟節(jié)點被選中。
10、next & nextAll
這些函數與prev和prevAll工作方式相同,不過它選擇的是下一個兄弟姐妹。
結論
最后,讓我們來看看如何利用這些函數來解決現實世界中令我們頭痛的問題。
$('.star').click(function(){
$(this).addClass('on');
// 如何取得當前對象的父級?
$(this).parent().addClass('rated');
// 如何獲得當前對象左側的star?
$(this).prevAll().addClass('on');
$(this).nextAll().removeClass('on');
});
這就是這篇教程中早期提到的問題,對嗎?在這幾行代碼中我們使用了這幾個遍歷函數。
- 在第5行,看看parent()函數,啊哈,真簡單。
- 在第8行和9行,prevAll()和nextAll().選擇填充的star和空的star。
現在,遍歷函數是做么的方便。當在一起使用時,它們將更加強大。也就是說,一個函數的輸出是另一個函數的輸入,它們是鏈式的。
謝謝你的拜讀,希望這篇教程在你通過jQuery選擇html元素時更容易。你有什么想法?哪個遍歷函數是我們遺漏的?
原文:10 Really Helpful Traversing Functions in jQuery 譯文:http://www.denisdeng.com/?p=695
本文鏈接:http://m.95time.cn/tech/web/2010/7460.asp
出處:藍色理想
責任編輯:bluehearts
上一頁 jQuery中10個非常有用的遍歷函數 [3] 下一頁
◎進入論壇網頁制作、WEB標準化版塊參加討論,我還想發(fā)表評論。
|