Question

我需要获得总计li tags次 after a span tag and inside the ul tag 。

获取li标签后，我必须在span标签内更新此内容（与我的HTML代码类似）。

HTML代码

<ul id='navigation'>
    <li>
        <ul>
            <li class='IS'><span>4</span>
<!--This span value should be four as its adjucent ul contains 4 lis-->
            <ul>
                <li><span>3</span>
<!--This span value should be four as its adjucent ul contains 3 lis-->
                    <ul>
                        <li></li>
                        <li></li>
                        <li></li>
                    </ul>
                </li>
                <li><span>5</span>
<!--This span value should be four as its adjucent ul contains 5 lis-->
                    <ul>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                    </ul>
                </li>
                <li><span>4</span>
<!--This span value should be four as its adjucent ul contains 4 lis-->
                    <ul>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                    </ul>
                </li>
                <li><span>4</span>
<!--This span value should be four as its adjucent ul contains 4 lis-->                    
                    <ul>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                    </ul>
                </li>
            </ul>
            </li>
        </ul>
    </li>
</ul>

Jquery代码

$("#navigation ul li span+ul>li").each(function(){
cnts=$(this).length
console.log(cnts)
$("#navigation ul li span").html(cnts)
})

我手动填写了span标签内所需的Li标签输出。我的jquery没有提供所需的结果。任何建议都会有所帮助。

Answer 1

＆＃13;

$("#navigation ul li span").text(function(){
    return $(this).next('ul').children('li').length;
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul id='navigation'>
    <li>
        <ul>
            <li class='IS'><span></span>
<!--This span value should be four as its adjucent ul contains 4 lis-->
            <ul>
                <li><span></span>
<!--This span value should be four as its adjucent ul contains 3 lis-->
                    <ul>
                        <li></li>
                        <li></li>
                        <li></li>
                    </ul>
                </li>
                <li><span></span>
<!--This span value should be four as its adjucent ul contains 5 lis-->
                    <ul>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                    </ul>
                </li>
                <li><span></span>
<!--This span value should be four as its adjucent ul contains 4 lis-->
                    <ul>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                    </ul>
                </li>
                <li><span></span>
<!--This span value should be four as its adjucent ul contains 4 lis-->                    
                    <ul>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                    </ul>
                </li>
            </ul>
            </li>
        </ul>
    </li>
</ul>

＆＃13;

只需使用text()方法：

$("#navigation ul li span").text(function(){
    return $(this).next('ul').children('li').length;
});

如何获得总li标签计数

1 个答案: