Question

我有一些像这样的层

<div class="evenprop">some prop</div>
<div class="evenprop">some prop2</div>
<div class="evenprop">some prop3</div>

<h3 class="otherprop">Other Props</h3>

<div class="evenprop">some prop4</div>
<div class="evenprop">some prop5</div>

这很好，但如果数据看起来像这样，我需要隐藏“otherprop”类

<div class="evenprop">some prop</div>
<div class="evenprop">some prop2</div>
<div class="evenprop">some prop3</div>
<div class="evenprop">some prop4</div>
<div class="evenprop">some prop5</div>

<h3 class="otherprop">Other Props</h3>

这些图层是动态放入的，所以不知道如何做到这一点我不知何故需要说如果“otherprop”类下面没有数据，那么隐藏“otherprop”如果有意义

如果下面没有数据

，则为期望的结果

<div class="evenprop">some prop</div>
<div class="evenprop">some prop2</div>
<div class="evenprop">some prop3</div>
<div class="evenprop">some prop4</div>
<div class="evenprop">some prop5</div>

但如果有以下数据

<div class="evenprop">some prop</div>
<div class="evenprop">some prop2</div>
<div class="evenprop">some prop4</div>
<div class="evenprop">some prop5</div>

<h3 class="otherprop">Other Props</h3>

<div class="evenprop">some prop3</div>

非常感谢

杰米

Answer 1

尝试这样的事情

var nxtSib = document.getElementsByClassName('otherprop')[0].NextSibling;
if(nxtSib != 'evenprop')
    nxtSib.style.display = 'none';

Answer 2

在CSS中试试这个：

.otherprop:last-child {
  display: none;
}

Answer 3

无论何时动态更改数据，都可以检查是否有任何此类内容，例如......

var op = $('.otherprop');
if(op.nextAll('div').length) {
    op.show();
else {
    op.hide();
}

我还建议您使用op.show()和op.hide()以及随附的css

，而不是使用op.addClass('available')和op.removeClass('available')。

.otherprop {
    display: none;
}
.otherprop.available {
    display: block;
}

未经测试，但应该有效。

Answer 4

感谢您的回答，但这就是我最终获得所需结果的方式

if ($('.property > .evenprop').is(':visible')){
            $('.otherprop').show();
        } else {
            $('.otherprop').hide();
        }

如果下面没有div，则隐藏标题

4 个答案: