Javascript 如果not count==0，我希望我的通知框的背景变成红色…我该怎么做？

所以如果（计数=0） {我不希望对通知框产生影响} 其他的 {我希望通知框变为红色} 这就是我所做的，但它不起作用。我的意思是什么都没有发生，我通过inspect元素检查了css，但什么都没有

      <style>
          {% block style %}
        #notification_dropdown.notification { background: red; }
        {% endblock %}
          </style>
    <li class="dropdown">
                  <a href="#" class="dropdown-toggle notification-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
<span class='glyphicon glyphicon-inbox' aria-hidden="true"></span>
<span class="caret"></span></a>
                  <ul class="dropdown-menu" role="menu" id='notification_dropdown'>

                  </ul>
                </li>
    <script>
        $(document).ready(function(){
          $(".notification-toggle").click(function(e){
            e.preventDefault();
            $.ajax({
              type: "POST",
              url: "{% url 'get_notifications_ajax' %}",
              data: {
                csrfmiddlewaretoken: "{{ csrf_token }}",
              },
             success: function(data){
                $("#notification_dropdown").html(' <li role="presentation" class="dropdown-header">Notifications</li>');
                var count = data.count
                console.log(count)
                if (count == 0) {
                      $("#notification_dropdown").removeClass('notification');
                  var url = '{% url "notifications_all" %}'
                  $("#notification_dropdown").append("<li><a href='" + url+ "'>View All Notifications</a></li>")
                } else {
                      $("#notification_dropdown").addClass('notification');
                  $(data.notifications).each(function(){
                    var link = this;
                    $("#notification_dropdown").append("<li>" + link + "</li>")
                  })
                }
                console.log(data.notifications);
              },
              error: function(rs, e) {
                console.log(rs);
                console.log(e);
              }
            })
          })
        })
        </script> 

{%块样式%}
#notification_dropdown.notification{background:red；}
{%endblock%}




$（文档）.ready（函数（）{
$（“.notification toggle”）。单击（函数（e）{
e、 预防默认值（）；
$.ajax({
类型：“POST”，
url:“{%url'获取通知\u ajax%}”，
数据：{
csrfmiddlewaretoken:“{{csrf_令牌}}”，
},
成功：功能（数据）{
$（“#通知”下拉列表“）.html（“
通知”）；
var count=data.count
console.log（计数）
如果（计数=0）{
$（“#通知#下拉列表”）.removeClass（“通知”）；
var url=“{%url”通知_所有“%}”
$（“通知”下拉列表）。追加（“
”）
}否则{
$（“通知”下拉列表”）.addClass（“通知”）；
$（data.notifications）.each（函数（）{
var-link=这个；
$（“#通知”下拉列表）。追加（“
”+链接+”
”）
})
}
console.log（数据通知）；
},
错误：函数（rs，e）{
控制台日志（rs）；
控制台日志（e）；
}
})
})
})

我添加了

$（“#通知_下拉列表”）.removeClass（'notification'）

和
$（“通知”下拉列表”）.addClass（“通知”）
在if和else之后

然后我使用css。。。
我做错了什么？
下面是一个简单的例子来回答你的问题：
HTML和您的元素以及触发/测试JS代码的按钮：

<ul class="dropdown-menu" role="menu" id='notification_dropdown'>
Notification text
</ul>

<a href="#" id="button">Button</a>

以及JavaScript代码：

myButton = $("#button");

count = 0;

myButton.click( function() {
  myQuery = $("#notification_dropdown");
  console.log( count );

  if( count == 0 )
  {
    myQuery.removeClass( "notification" );
  }
  else
  {
    myQuery.addClass( "notification" );
  }

  // This is done just for the test matter
  count++; 
});

只需在按钮上多次单击即可触发相关的
单击
功能，该功能也会更改
计数
（用于测试目的）。
JQuery保存在变量
myQuery
中，以避免在没有明确目的的情况下多次实现同一查询

下面是一个简单的例子来回答您的问题：
HTML和您的元素以及触发/测试JS代码的按钮：

<ul class="dropdown-menu" role="menu" id='notification_dropdown'>
Notification text
</ul>

<a href="#" id="button">Button</a>

以及JavaScript代码：

myButton = $("#button");

count = 0;

myButton.click( function() {
  myQuery = $("#notification_dropdown");
  console.log( count );

  if( count == 0 )
  {
    myQuery.removeClass( "notification" );
  }
  else
  {
    myQuery.addClass( "notification" );
  }

  // This is done just for the test matter
  count++; 
});

只需在按钮上多次单击即可触发相关的
单击
功能，该功能也会更改
计数
（用于测试目的）。
JQuery保存在变量
myQuery
中，以避免在没有明确目的的情况下多次实现同一查询

很难说，因为您的代码不是可执行的。您应该编写一个简化的示例（并首先尝试）。您是否检查了
$（“#通知_下拉列表”）
是否返回您期望的结果？顺便说一句，为了提高效率，您还应该“保存”查询：
myQ=$（“通知”下拉列表）
@MathieucQuerelle是的，我确实检查过/I获得
@MathieucQuerelle保存什么？…对JS不好见下面我的答案；）很难说，因为您的代码不是可执行的。您应该编写一个简化的示例（并首先尝试）。您是否检查了
$（“#通知_下拉列表”）
是否返回您期望的结果？顺便说一句，为了提高效率，您还应该“保存”查询：
myQ=$（“通知”下拉列表）
@MathieucQuerelle是的，我确实检查过/I获得
@MathieucQuerelle保存什么？…对JS不好见下面我的答案；）你好，谢谢你的回复。按钮是什么？我假设它在我的例子中？在我的例子中，
按钮
id只是用来有一个可点击的元素（这样我就可以触发改变类的函数）。所以我想在你的代码中，它应该与
class=“dropdown toggle notification toggle”
的div有某种关联。谢谢你的回复。/我整天都在努力解决这个问题……所以我不应该点击右键？我应该放下拉开关而不是Button？你好，谢谢你的回复。按钮是什么？我假设它在我的例子中？在我的例子中，
按钮
id只是用来有一个可点击的元素（这样我就可以触发改变类的函数）。所以我想在你的代码中，它应该与
class=“dropdown toggle notification toggle”
的div有某种关联。谢谢你的回答。/我整天都在努力解决这个问题……所以我不应该点击右键？我应该把dropdown toggle放在按钮上而不是Button上？