Question

我正试图让它评论计数器div。如果注释为0 div class为红色或者大于0 div class为蓝色，但是javascript重复相同的颜色。

$(function () {
    if(parseInt($(".notification-counter").text()) > 0) {
        //$(".notification-counter").hide();
        $('.notification-container').addClass('notification-container2');
    }
});

jsfiddle：http://jsfiddle.net/783h57zy/10/

感谢您的回答！

Answer 1

您需要迭代元素然后更新类。

您需要将代码更新为

$(function () {
    $(".notification-counter").each(function(){
    if(parseInt($(this).text()) > 0) {
        //$(".notification-counter").hide();
        $(this).parent().addClass('notification-container2');
    }
    });

});

这是更新的小提琴 - http://jsfiddle.net/783h57zy/12/

Answer 2

你需要遍历你的div并单独检查它们：

$.each：循环显示divs

'.parent()'：获取容器div

$（this）：使用当前对象

$(function () {
    $('.notification-counter').each(function () {
        if (parseInt($(this).text()) > 0) {
            $(this).parent().removeClass('notification-container').addClass('notification-container2');
        } else {
            $(this).parent().removeClass('notification-container2').addClass('notification-container');
        }
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="notification-container">
    <div class="notification-counter">200</div>
</div>
<div class="notification-container">
    <div class="notification-counter">0</div>
</div>

Answer 3

由于页面上有许多同一个类的实例，因此您需要遍历每个实例并根据每个元素做出决定。

$(function () {

    $('.notification-counter').each(function(){

        if( parseInt($(this).html()) === 0 ) {
            $(this).addClass('notification-container2');
        }

    });

});

更新：http://jsfiddle.net/783h57zy/14/

Answer 4

$(function () {
$('.notification-counter')
  .filter(function() {
      return $(this).text() > 0;
  }).parents('.notification-container')
  .addClass('notification-container2');
});

jsfiddle

如何复制div类颜色

4 个答案: