如何用JS判断div中内容为空,当为空时隐藏div

网页代码如下:
<div class="right_con_div" id="nodiv">
<h2>标题1</h2>
<ul id="id_inner"></ul>
</div>
<div class="right_con_div" id="nodiv">
<h2>标题2</h2>
<ul id="id_inner">
<li>列表1</li>
<li>列表2</li>
</ul>

</div>
用JS代码判断当ul中内容为空的时候,隐藏整个父级div,其它div有内容的不隐藏。

<div class="right_con_div" id="nodiv">
        <h2>标题1</h2>
        <ul class="id_inner"></ul>
      </div>
<div class="right_con_div" id="nodiv">
        <h2>标题2</h2>
        <ul class="id_inner">
       <li>列表1</li>
       <li>列表2</li>
       </ul>
      </div>

你在定义id时需要注意,元素的id尽量不要相同。否则不能区分是哪个元素。像现在这种情况ul需要用
相同的 class名 我用了id_inner
<script>
var test=document.getElementsByClassName('id_inner');
for(var i=0 ;i<test.length;i++)
{
    var p=test[i].parentNode;
    if(p.getElementsByTagName('li').length==0)
    {
         p.style.display='none';
     }
}
</script>

追问

此乃神人也! 一次测试成功。。。

温馨提示:答案为网友推荐,仅供参考

相关了解……

你可能感兴趣的内容

本站内容来自于网友发表,不代表本站立场,仅表示其个人看法,不对其真实性、正确性、有效性作任何的担保
相关事宜请发邮件给我们
© 非常风气网