Jquery實現(xiàn)獲取子元素的方法分析
本文實例講述了Jquery實現(xiàn)獲取子元素的方法。分享給大家供大家參考，具體如下：
Jquery獲取子元素的方法有2種，分別是children()方法和find()方法。下面我們分別來使用這兩種方法，看看它們有何差異。
1.children()方法：獲取該元素下的直接子集元素
2.find()方法：獲取該元素下的所有子集元素
分別以以下HTML代碼為例：
<ul>
<li>
list1
<ul>
<li>
list1-1
</li>
<li>
list1-2
</li>
</ul>
</li>
<li>
list2
<ul>
<li>
list2-1
</li>
<li>
list2-2
</li>
</ul>
</li>
<li>
list3
<ul>
<li>
list3-1
</li>
<li>
list3-2
</li>
</ul>
</li>
</ul>
3、children()方法獲取ul下面直接子集元素li：$("ul").children("li")
需要注意的是，如果li元素下還有l(wèi)i元素，children方法將不會被獲取。我們可以用length來測試獲取的個數(shù)“$("ul").children("li").length”，最后輸出結(jié)果為3
4、find()方法獲取ul下所有元素li：$("ul").find("li")
需要注意的是，find方法會無限循環(huán)查找ul標(biāo)簽節(jié)點下的li，一直找到?jīng)]有為止，用length來測試獲取個數(shù)“$("ul").find("li").length”，最后輸出結(jié)果為9
5、children和find的區(qū)別：children只會查找直接子集，而find會跨越層級查找，一直找到?jīng)]有為止。
更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《jQuery常見事件用法與技巧總結(jié)》、《jQuery常用插件及用法總結(jié)》、《jQuery操作json數(shù)據(jù)技巧匯總》、《jQuery擴展技巧總結(jié)》、《jQuery常見經(jīng)典特效匯總》及《jquery選擇器用法總結(jié)》
希望本文所述對大家jQuery程序設(shè)計有所幫助。
相關(guān)文章
這篇文章主要介紹了jquery對象和DOM對象的相互轉(zhuǎn)換詳解的相關(guān)資料,需要的朋友可以參考下2016-10-10
這篇文章主要為大家詳細介紹了jQuery事件對象的屬性和方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-09-09
Jquery的cookies插件，感覺不錯，但是跟蹤調(diào)試的時候發(fā)現(xiàn)cookies上面還是多寫了一個相同名稱的值，這就麻煩了，后來看到網(wǎng)上有人說用這個方法，感覺還不錯2010-03-03
這篇文章主要介紹了JQuery中DOM加載與事件執(zhí)行,實例分析了jQuery中DOM加載及事件執(zhí)行的原理與實現(xiàn)方法,并補充說明了windows.onload方法和$(document).ready()方法的區(qū)別,需要的朋友可以參考下2015-06-06
這篇文章主要介紹了jQuery使用之標(biāo)記元素屬性用法,實例分析了jQuery如何控制頁面,包含元素的屬性、css樣式風(fēng)格、DOM模型、表單元素和事件處理等使用技巧,需要的朋友可以參考下2015-01-01
jQuery調(diào)取jSon數(shù)據(jù)并展示的方法
這篇文章主要介紹了jQuery調(diào)取jSon數(shù)據(jù)并展示的方法,實例分析了jQuery調(diào)用json數(shù)據(jù)及展示的相關(guān)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-01-01
JQuery入門——事件切換之hover()方法應(yīng)用介紹
謂切換事件，即有兩個以上的事件綁定于一個元素，在元素的行為動作間進行切換,有兩個方法用于事件的切換，一個方法是hover()，另一個是toggle(),感興趣的朋友不妨了解下,或許對你有所幫助2013-02-02
這篇文章主要介紹了jQuery實現(xiàn)的簡單百分比進度條效果,結(jié)合簡單實例形式分析了jQuery針對頁面元素的運算與動態(tài)操作相關(guān)操作技巧,需要的朋友可以參考下2016-08-08
這篇文章主要介紹了jQuery?編程之jQuery?屬性選擇器，文章圍繞主題展開詳細的內(nèi)容介紹，具有一定的參考價值，需要的小伙伴可以參考一下2022-08-08
jQuery實現(xiàn)的粘性滾動導(dǎo)航欄效果實例【附源碼下載】
這篇文章主要介紹了jQuery實現(xiàn)的粘性滾動導(dǎo)航欄效果,涉及jQuery插件smint的相關(guān)使用技巧,并附帶完整實例源碼供讀者下載參考,需要的朋友可以參考下2017-10-10