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
”,最后輸出結果為3
4、find()方法獲取ul下所有元素li:$("ul").find("li")
需要注意的是,find方法會無限循環(huán)查找ul標簽節(jié)點下的li,一直找到?jīng)]有為止,用length來測試獲取個數(shù)“$("ul").find("li").length
”,最后輸出結果為9
5、children和find的區(qū)別:children只會查找直接子集,而find會跨越層級查找,一直找到?jīng)]有為止。
更多關于jQuery相關內容感興趣的讀者可查看本站專題:《jQuery常見事件用法與技巧總結》、《jQuery常用插件及用法總結》、《jQuery操作json數(shù)據(jù)技巧匯總》、《jQuery擴展技巧總結》、《jQuery常見經(jīng)典特效匯總》及《jquery選擇器用法總結》
希望本文所述對大家jQuery程序設計有所幫助。
相關文章
jQuery插件實現(xiàn)非常實用的tab欄切換功能【案例】
這篇文章主要介紹了jQuery插件實現(xiàn)非常實用的tab欄切換功能,涉及jQuery事件響應及頁面元素屬性動態(tài)操作相關實現(xiàn)技巧,需要的朋友可以參考下2019-02-02jQuery選擇器源碼解讀(四):tokenize方法的Expr.preFilter
這篇文章主要介紹了jQuery選擇器源碼解讀(四):tokenize方法的Expr.preFilter,本文用詳細的注釋解讀了tokenize方法的Expr.preFilter的實現(xiàn)源碼,需要的朋友可以參考下2015-03-03jQuery動態(tài)添加刪除select項(實現(xiàn)代碼)
以下是對jQuery動態(tài)添加刪除select項的實現(xiàn)代碼進行了詳細的分析介紹,需要的朋友可以過來參考下2013-09-09