jQuery显示内容:在文档中找到某些DIV之后

Question

我在我们的商店上有用户评论选项卡，并在.tab:after中放置图像，以使其更加可见。但是我只想在已经有任何用户评论时显示此内容。

为什么我的代码不起作用？

<script>
$(document).ready(function() {
    if($('.review').length) { 
      $(".tab:after").css("display", "block");
    } 
    else { 
      $(".tab:after").css("display", "none"); 
    }
});
</script>

jsfiddle在这里

编辑：谢谢大家！这会做魔术：

$(document).ready(function() {
    if($('.review').length >0) { 
        $(".tab").addClass('show-it')
    }
});

CSS：

.tab:after {
    display:none;
    }
.tab.show-it:after {
    display:block;
    }

Answer 1

那是因为".tab:after"选择器将返回一个空集，为jQuery和JavaScript一般无法选择/操纵CSS pseudo元素。您可以使用类，切换并将操作留给CSS。

.tab.block:after {
    display: block;
    ...
}

$(".tab").toggleClass("block", $(".review").length > 0);

http://jsfiddle.net/tzefrbvr/

Answer 2

尝试以下：

<script>
$(document).ready(function() {
    if($('.review').length >0) { 
      $(".tab:after").css("display", "block");
    } 
    else { 
      $(".tab:after").css("display", "none"); 
    }
});
</script>

Answer 3

您需要删除:after。请参阅下面的链接

jsfiddle