jquery - 選擇即時li文本，而不選擇兒童ul的文本

Question

我想採取嵌套html無序列表的結構作爲數據庫的一些信息需要組織和分析。我試圖過濾，計數和使用jQuery呈現信息。我爭取的列表沒有任何類或id屬性，以便他們非常乾淨。只有root將有一個類或ID是這樣的：

<ul id="root"> 
<li> First first-level element 
    <ul> 
    <li> First second-level element 
     <ul> 
     <li>First Third-level element</li> 
     <li>Second Third-level element</li> 
     </ul> 
    </li> 
    <li> Second second-level element 
     <ul> 
     <li>Third Third-level element</li> 
     <li>Fourth Third-level element</li> 
     </ul> 
    </li> 
    </ul> 
</li> 
<li> Second first-level element 
    <ul> 
    <li> Third second-level element 
     <ul> 
     <li>Fifth Third-level element</li> 
     </ul> 
    </li> 
    </ul> 
</li> 
</ul> 

我的問題是：我怎麼能選擇一個李的直接子文本節點，而在李的孩子和孫子UL的（即其子列表）選擇文本？例如，上面給出的HTML列表，我希望能夠拿出所有文本節點中的第二級列表：

• 第一第二級元素
• 其次第二級元素
• 第三第二級元素

或者從第三級...等等，讓我列出並計算在給定的級別項目中的所有文本。最近我一直是：

// to select items in second but not third level 
$('ul#root ul').not('ul#root ul ul').children('li') 

但它不是一個靈活的解決方案。如果名單中有很多層次，比如說七個，該怎麼辦？選擇第六級，你將不得不這樣做：

// to select items in second but not third level 
$('ul#root ul ul ul ul ul').not('ul#root ul ul ul ul ul ul').children('li') 

必須有另一種方式，但我還沒有找到它。任何建議，非常感謝。

Answer 1

如果您想選擇第二李如<li> Second second-level element，你可以用eq這樣使用>孩子選擇：

$('ul#root > ul > li').eq(1) 

爲您設置eq到2，因爲它的索引從0開始第三。

要遍歷它們，你可以使用each這樣的：

$('ul#root > ul > li').eq(1).each(function(){ 
    alert($(this).text()); 
}); 

更多信息：

• Child Selector
• .eq()

Answer 2

如這裏說明：

jQuery: Find the text of a list item that contains a nested ul

「正常DOM方法允許訪問文本內容只是一個元件」

因此，這是一個解決方案：該輸出第三級別的元素逐個：

$('ul#root > li > ul > li > ul').children('li').each(function(){ 
    alert($(this)[0].firstChild.textContent); 
}); 

這輸出第二級元素：

$('ul#root > li > ul').children('li').each(function(){ 
    alert($(this)[0].firstChild.textContent); 
}); 

組該輸出第一級別的元素：

$('ul#root').children('li').each(function(){ 
    alert($(this)[0].firstChild.textContent); 
}); 

Answer 3

更魯棒的方法是使用遍歷「內容」，並選擇節點與類型（3），其是用於在HTML文本子元素節點類型。例如：

$('ul#root > li > ul > li > ul').children('li').contents().each(function() { 
    if (this.nodeType == 3) alert(this.nodeValue); 
});