[問題] 如何用jQuery指定階層抓取DOM物件

看板Ajax作者 (三天)時間15年前 (2010/09/29 18:50), 編輯推噓2(2013)
留言15則, 5人參與, 最新討論串1/1
前輩好, 假如我的HTML架構為 ========================================== <div id="mainContainer"> <!--第一層第一個ul--> <ul> <li>1 - 1 <!--第二層第一個ul--> <ul> <li>1 - 1 - 1 <!--第三層第一個ul--> <ul></ul> </li> <li>1 - 1 - 2</li> </ul> </li> <li>1 - 2 <!--第二層第二個ul--> <ul></ul> </li> <li>1 - 3</li> <li>1 - 4</li> </ul> <!--第一層第二個ul--> <ul> <li>2 - 1</li> </ul> </div> ========================================== 我想要抓取第一層的ul下的第一層li 我可以下 ========================================== $('#mainContainer>ul>li'); ========================================== 只是想請問,假如我已經有一個jQuery物件 ========================================== $container = $('#mainContainer'); ========================================== 我要怎麼使用$container這個物件去找出他下之下第一層的ul的第一層li呢 我知道可以用 ========================================== $container.children('ul').children('li'); ========================================== 去找出我要的物件 只是這個狀況是簡化後的過程 實際上用起來可能是要找第n層的ul的第m層li 或著更複雜的狀況 這樣用.chilren([selector])去串接 不只難以閱讀,可能效能上也會有影響(? 其實不確定) 是以想請問前輩 jQuery有辦法用指定階層數的方法找到指定的物件嗎 例如說$container下第n層的ul之類的語法 又或著有比較簡單易讀的寫法呢 -- -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 118.169.184.210

09/29 19:00, , 1F
試試看selector用ul:eq(數字)
09/29 19:00, 1F

09/29 19:00, , 2F
不過eq好像是抓相鄰的...
09/29 19:00, 2F

09/29 19:01, , 3F
還有.find("ul ul ul li")這個..
09/29 19:01, 3F

09/29 19:24, , 4F
:eq是抓集合中的第幾個 沒法抓到第幾層..
09/29 19:24, 4F

09/29 19:26, , 5F
用find('ul ul ul li')
09/29 19:26, 5F

09/29 19:26, , 6F
它會連符合('ul ul ul ul ul ul li')都一起抓出來
09/29 19:26, 6F

09/29 19:47, , 7F
阿find裡面是給你寫seclector的阿 你也可以寫ul>li
09/29 19:47, 7F

09/29 19:47, , 8F
selector
09/29 19:47, 8F

09/29 20:55, , 9F
我回在Web_Design版了
09/29 20:55, 9F

09/29 21:46, , 10F
find ("> ul > ul > ul > li") 這樣就好啦
09/29 21:46, 10F

09/29 21:49, , 11F
我覺得你給了他一個太複雜的結構了,這麼複雜的結構倒不如用
09/29 21:49, 11F

09/29 21:49, , 12F
class來找比較清楚明確,因為 dom tree會變但class不太會變
09/29 21:49, 12F

09/29 22:52, , 13F
謝謝 find('>ul xxxx')是我要找的語法
09/29 22:52, 13F

09/29 22:52, , 14F
現在才知道原來[selector]可以用'>'開頭 受教了
09/29 22:52, 14F

09/30 03:54, , 15F
>是下一層(不包括下下下下下*n層的任一符合名字的物件)
09/30 03:54, 15F
文章代碼(AID): #1Cendw66 (Ajax)
文章代碼(AID): #1Cendw66 (Ajax)