js根据子目录数目显示父级目录

Posted 2020-10-04 微醺

　　需求：<ul>中<li>数量为0，则不显示<ul>以及<b>；<div>中<ul>数量为0，则不显示<div>

　　1.html代码

//
<div class="myPerson" id="myPersonBtn">
    人物管理
</div>
<div class="myPersonClass" id="myPersonId">
    <b>春秋五霸</b>
    <ul>
    </ul>
    <b>三国演义</b>
    <ul>
        <li><a href="">曹操</a></li>
        <li><a href="">刘备</a></li>
        <li><a href="">孙权</a></li>
        <li><a href="">诸葛亮</a></li>
        <li><a href="">司马懿</a></li>
        <li><a href="">周瑜</a></li>
        <li><a href="">陆逊</a></li>
        <li><a href="">郭嘉</a></li>
        <li><a href="">荀彧</a></li>
        <li><a href="">关羽</a></li>
    </ul>
    <b>战国七雄</b>
    <ul>
    </ul>
</div>

　　2.js实现代码（不要忘了引入jQuery）

 

    isShowMenu("#myPersonId");

    function isShowMenu(id){
        $(id).find(‘ul‘).each(function(ulObj){
            var liCount = $(this).find(‘li‘).length;
            if(liCount <= 0){
                $(this).prev().css(‘display‘,‘none‘);
                $(this).remove();
            }
        });
        //
        var ulCount = $(id).find(‘ul‘).length;
        if(ulCount <= 0){
            $(id).remove();
        }
    }