Прототип: как выбрать вложенные элементы? - PullRequest
Новая
       10

Прототип: как выбрать вложенные элементы?

0 голосов
/ 12 декабря 2011

Я следую 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); 
           });
        });

Ответы [ 2 ]

1 голос
/ 12 декабря 2011

Я решил свою проблему: 

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); 
           });
       }
    });

Спасибо всем за ваши комментарии!

1 голос
/ 12 декабря 2011

Если вам нужны только элементы первого уровня <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>
    }
});
...