jquery中獲取元素里某一特定子元素的代碼
之前做的一些JQUERY應(yīng)用都是些很基礎(chǔ)的編程，對(duì)于選擇器要求不高，像類似于“$('.class')”、“$('#id')”、“$('#id>.class')”、“$(this)”、“$(this).parent()”、“$(this).children()”這些簡(jiǎn)單的語(yǔ)句都能解決的。
問(wèn)題的出現(xiàn)是我要選擇一個(gè)ul里某個(gè)的li中的一個(gè)span，因?yàn)橐诰幊?，li是用 $('ul>li').eq(i) 來(lái)做的選擇，雖然問(wèn)題還是能用之前的方法解決，但總感覺(jué)代碼有點(diǎn)臃腫,而且效率也很低下。既然JQUERY被譽(yù)為目前所有JS框架中最高效的代碼，不可能連這個(gè)問(wèn)題都要用一大坨代碼來(lái)解決吧！
回頭再翻翻JQUERY的API，才發(fā)現(xiàn)有一個(gè)非常適合這個(gè)場(chǎng)合使用的語(yǔ)句我一直沒(méi)有注意過(guò)。那就是：$(選擇器一).find(選擇器二)。之前雖然讀過(guò)find這段介紹，但一直因?yàn)橛貌坏蕉缓鲆暋?/p>
這里說(shuō)說(shuō)find()的使用方法
API提供的的解釋：搜索所有與指定表達(dá)式匹配的元素。這個(gè)函數(shù)是找出正在處理的元素的后代元素的好方法。
使用方法：$(選擇器一).find(選擇器二)；
以小劇客棧首頁(yè)的焦點(diǎn)圖,查找類為“.focusphoto”的DL下DD中的span并將其作淡出處理為例：
$('.focusphoto>dl>dd).eq(i).find(”span”).fadeOut('slow');
談?wù)勑?duì)find()的理解
我這個(gè)應(yīng)用實(shí)際上完全可以用children()來(lái)代替，但這并不是說(shuō)find()和children()的用法是一樣的，如果是這樣的話find()的存在便沒(méi)有了意義。在查詢深度為一級(jí)的時(shí)候，這兩者有相同之處，但區(qū)別就在于：find()是子查詢選擇器，它可以深入到子級(jí)的下層進(jìn)行查詢選擇；而children():只是子級(jí)選擇器，它只能選擇下一層級(jí)的元素。
當(dāng)然，以上僅僅是劇中人的一點(diǎn)拙見(jiàn)，如有錯(cuò)誤或不完善的地方，請(qǐng)給于指正，謝謝！
- jquery查找父元素、子元素(個(gè)人經(jīng)驗(yàn)總結(jié))
- 使用jquery選擇器如何獲取父級(jí)元素、同級(jí)元素、子元素
- jQuery獲得子元素個(gè)數(shù)的方法
- jQuery獲取所有父級(jí)元素及同級(jí)元素及子元素的方法(推薦)
- Jquery實(shí)現(xiàn)獲取子元素的方法分析
- jquery使用remove()方法刪除指定class子元素
- Jquery獲取第一個(gè)子元素簡(jiǎn)單實(shí)例
- jquery判斷元素的子元素是否存在的示例代碼
- jquery刪除指定子元素代碼實(shí)例
- 輕松掌握jQuery獲取第二個(gè)子元素集合的技巧！
相關(guān)文章
自己動(dòng)手制作jquery插件之自動(dòng)添加刪除行的實(shí)現(xiàn)
我們常常會(huì)遇到這樣的情況，一個(gè)系統(tǒng)中有大量的需要對(duì)一個(gè)行進(jìn)行復(fù)制添加，希望能夠進(jìn)行批量的操作，這個(gè)時(shí)候，我們就可以考慮把它做成一個(gè)jquery插件了.2011-10-10
jQuery實(shí)現(xiàn)的登錄浮動(dòng)框效果代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)的登錄浮動(dòng)框效果代碼,點(diǎn)擊登陸鏈接可彈出懸浮登錄框,涉及jQuery中show與hide方法的使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-09-09
在用jquery獲取下拉列表ddl的值時(shí)返回的為字符串‘null’，而不是空值，結(jié)果導(dǎo)致獲取的參數(shù)不對(duì)2011-03-03
JQuery form表單提交前驗(yàn)證單選框是否選中、刪除記錄時(shí)驗(yàn)證經(jīng)驗(yàn)總結(jié)(整理)
這篇文章主要介紹了JQuery form表單提交前驗(yàn)證單選框是否選中、刪除記錄時(shí)驗(yàn)證經(jīng)驗(yàn)總結(jié)，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友參考下吧2017-06-06
基于jquery實(shí)現(xiàn)的一個(gè)選擇中國(guó)大學(xué)的彈框 (數(shù)據(jù)、步驟、代碼)
基于jquery實(shí)現(xiàn)的一個(gè)選擇中國(guó)大學(xué)的彈框，需要的朋友可以參考下2012-07-07
jQuery允許您創(chuàng)造時(shí)尚而又用戶體驗(yàn)友好的網(wǎng)站，不僅看起來(lái)悅目，而且他輕量級(jí)的大小負(fù)荷使網(wǎng)站響應(yīng)相當(dāng)迅速。這是jQuery在Web開發(fā)領(lǐng)域如此受重視的原因2012-04-04
jquery瀏覽器滾動(dòng)加載技術(shù)實(shí)現(xiàn)方案
Google閱讀器上有一個(gè)AJAX效果很不錯(cuò)，就是閱讀項(xiàng)目時(shí)不需要翻頁(yè)，瀏覽器滾動(dòng)條往下拉到一定位置時(shí)自動(dòng)加載新的一批項(xiàng)目進(jìn)來(lái)，一直到所有項(xiàng)目加載完為止。對(duì)于我來(lái)說(shuō)再好不過(guò)了，因?yàn)槲液懿幌矚g翻頁(yè)，尤其是輸入頁(yè)碼再定位到頁(yè)。2014-06-06
JQuery對(duì)表單元素的基本操作使用總結(jié)
這篇文章主要介紹了JQuery對(duì)表單元素的基本操作使用總結(jié),需要的朋友可以參考下2014-07-07
jQuery不間斷滾動(dòng)效果(模擬百度新聞支持文字/圖片/垂直滾動(dòng))
jQuery模擬百度新聞不間斷滾動(dòng)效果并且支持文字、圖片水平垂直滾動(dòng)等等，感興趣的朋友可以了解下，或許本文所提供的案例對(duì)你學(xué)習(xí)jquery特效有所幫助,好了話不多說(shuō)，切入正題2013-02-02
快速移動(dòng)鼠標(biāo)觸發(fā)問(wèn)題及解決方法(ECharts外部調(diào)用保存為圖片操作及工作流接線mouseenter和mouseleav
這篇文章主要介紹了快速移動(dòng)鼠標(biāo)所觸發(fā)的問(wèn)題及解決方法(ECharts外部調(diào)用保存為圖片操作及工作流接線mouseenter和mouseleave),非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-08-08