Question

我遵循html结构：

<div class="main">
   <ul id="nav">
       <li>
             <a></a>
             <div>
                 <ul class="level0">
                      <li>
                         .......                                
                      </li>
                      .......
                      <li> 
                         .........
                      </li>
                 </ul>
             </div>
       </li>
       ......
       <li>
             <a></a>
             <div>
                 <ul class="level0">
                      <li>
                         .........
                      </li>
                      .........
                      <li> 
                         .........
                      </li>
                 </ul>
             </div>
       </li>
   </ul>
</div>

我知道如何选择所有第一级li：

var listNodeLi = $('#main > ul').childElements();
listNodeLi.each(function(element)
{
     alert(element.nodeName);
});

但现在对于每个元素，我必须通过选择这样选择另一个li节点：

element > div > ul

但是在得到每个元素之后我无法理解如何组合元素和css选择器？

PS：所以，我试过了，仍然没有奏效。我得到了空名单。

  var arrLi = $('nav').childElements();
        arrLi.each(function(node)
        {
           list = $(node).down('ul.level0');
           alert(list);
           list.each(function(nodeLi)
           {
              alert(nodeLi.nodeName); 
           });
        });

Answer 1

如果您只想要第一级<li>元素，请使用：

$('.main ul#nav li')

如果您只想要第二级<li>元素，请使用：

$('.main ul.level0 li')

如果你想要两者，你可以这样做：

$('.main li').each(function() {
    if($(this).parent().hasClass('level0')) {
        // second level <li>
    }
    else {
        // first level <li>
    }
});

Answer 2

我解决了我的问题：

var arrLi = $('nav').childElements();


    arrLi.each(function(node)
    {
       nodeUl = $(node).select('div > ul.level0');

       if (nodeUl.length > 0)
       {
           /*
           here was a problem because nodeUL has array type here.
           I have only one ul element in the first node, therefore
           call it using nodeUl[0].
           */
           var nodesLi = nodeUl[0].childElements(); 

           nodesLi.each(function(nodeLi)
           {
              alert(nodeLi.nodeName); 
           });
       }
    });

感谢大家的评论！

原型：如何选择嵌套元素？

2 个答案: