如何从多个级别找到同一级别的第一个儿童名单

时间:2015-09-17 14:42:50

标签: javascript jquery select

我有一件小事,我挂断了。 我有这个标记

<div class="menu-build-group"> <!-- Level 1 -->
<ul class="menu-build-items">
    <li class="menu-build-item-wrapper">Level 1 Level 1 Level 1
        <div class="menu-item-relative-wrap">
            <div class="menu-build-item">
                <div class="menu-item-handle">
                    <span class="menu-item-number">1</span>
                </div>
            </div>
        </div>
        <div class="menu-keypress">
            <div class="menu-build-group">
                <ul class="menu-build-items">
                    <li class="menu-build-item-wrapper">Level 2 Level 2 Level 2
                        <div class="menu-item-relative-wrap">
                            <div class="menu-build-item">
                                <div class="menu-item-handle">
                                    <span class="menu-item-number">1.1</span>
                                </div>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </li>
    <li class="menu-build-item-wrapper">...</li>
    <li class="menu-build-item-wrapper">...</li>
    <li class="menu-build-item-wrapper">...</li>
    <li class="menu-build-item-wrapper">...</li>
    <li class="menu-build-item-wrapper">...</li>
</ul>
</div>

我正在尝试更改第一级菜单项目编号。

我使用了这个代码,我知道这个代码在我的情况下不起作用。

    function changeSectionNumbers(triggerEl){

        var sectionMenuGr = triggerEl.closest('.menu-build-group');

        sectionMenuGr.find('.menu-build-item-wrapper').each(function(index){
            var myIndex = index+1;
            $(this).find('.menu-item-number').text(myIndex); 
        })
   }

有什么方法可以只获得第一级元素&#34; menu-build-item-wrapper&#34;并更改菜单项编号文本?

3 个答案:

答案 0 :(得分:0)

试试这个:

<ul class="root-list menu-build-items">
    <li class="menu-build-item-wrapper">Level 1 Level 1 Level 1
       <div class="menu-keypress">
          <div class="menu-build-group">
             <ul class="menu-build-items">
                 <li class="menu-build-item-wrapper">Level 2 Level 2 Level 2

请注意root-list类添加到第一个ul元素

$("ul.root-list > li.menu-build-item-wrapper").each(function(index){
    var myIndex = index+1;
    $(this).find('.menu-item-number').text(myIndex); 
});

答案 1 :(得分:0)

你可以在div中包裹最外面的ul,例如

<div class="allitems">...</div>

然后您可以使用直接后代运算符:>

$(".allitems > 
 .menu-build-items > 
 .menu-build-item-wrapper > 
 .menu-item-relative-wrap > 
 .menu-build-item > 
 .menu-item-handle > 
 span");

答案 2 :(得分:0)

使用下面的选择器

获取第一级项目
$(".menu-build-group .menu-build-item-wrapper .menu-item-number:eq(0)")

在循环下面更改文字。

 var count=1;
 $(".menu-build-group .menu-build-item-wrapper .menu-item-number:eq(0)").
   each( function( ) { 
    this.innerHTML=count;count++;
   });