Question

我有一次主潜，里面有2次潜水。我需要检查如果div的数据为空，则不显示它们。 BTW数据来自API。

这是代码：

<div id ="select">
     <ul>
         <li><div id="product1" style="font-family:arial; font-size:13px; border-bottom:1px solid #b8b8b8; background-color:#eeeeee; padding:10px;">

               <strong>{$feed/API Feed_142197/__data["1-Title"]}</strong>
               <br/>
               <p>{$feed/API Feed_142197/__data["1-Desc"]}</p>

              <div style="display:inline; align:left; color:green; font-weight:bold;">{$feed/API Feed_142197/__data["1-Price"]}</div>

               <div style="display:inline; padding-left:80px; padding-right:5px;">click to call image</div></div>
         </li>


         <li><div id="product2" style="font-family:arial; font-size:13px; border-bottom:1px solid #b8b8b8; background-color:#eeeeee; padding:10px;">
              <strong>{$feed/API Feed_142197/__data["2-Title"]}</strong>
              <br/>
              <p>{$feed/API Feed_142197/__data["2-Desc"]}</p>
              <div style="display:inline; align:left; color:green; font-weight:bold;">{$feed/API Feed_142197/__data["2-Price"]}</div>
              <div style="display:inline; padding-left:80px; padding-right:5px;">click to call image</div></div>
         </li>

</div>

Answer 1

使用jQuery

var div1 = $('#product1'),
    div2 = $('#product2');

if (!(div1.text() || div2.text())) {
     $('#select').hide()
}

Answer 2

这是一个现代化的浏览器，无需库需要解决方案。

var nodes = document.querySelectorAll('#select div:empty');
for (var i = 0, il = nodes.length; i < il; i++) {
    nodes[i].style.display = 'none';
}

我需要在主div内部获取div，如果其中的数据为空，则隐藏theat div

2 个答案: