Django：在 javascript 函数中更改字体颜色

Question

再会，我的 html-body 的字体颜色通过带有以下代码的 css 文件进行更改：body {    background-color: #6d6a6a;    color: white;}现在我已经包含了一个 Bootstrap-Popover ......<button type="button" class="btn btn-sm btn-danger" data-toggle="popover" title="Popover title" data-content="And here's some amazing content. It's very engaging. Right?">Click to toggle popover</button>...以及必要的脚本...<script>    $(function () {      $('[data-toggle="popover"]').popover()    })</script>但是由于我的 css 文件，我的 popver 中的某些文本部分（准确地说是“标题”）也呈现为白色！我对javascript真的很陌生，所以有可能 - 如果可能的话，最好的解决方案是什么 - 将我的 Popover 中的字体颜色更改为黑色？感谢大家！

Answer 1

如果您的 css 没有动态更改，则仅使用 css

 .popover .popover-content,.popover .popover-title  {

     color: red;

  }

但是如果你动态地改变你的身体，那么你可以为你的弹出框添加类。Popover 总是.popover作为类名，所以你可以

$(document).ready(function () {

    $(function () {

      $('[data-toggle="popover"]').popover()

    });           

});

  

function popchange(){

     setTimeout(function () {

       $(".popover").addClass('popover-danger');

    }, 10); 

}

.popover-danger {

     color: red;

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>

<button type="button" class="btn btn-sm btn-danger" data-toggle="popover"onclick="popchange()" title="Popover title" data-content="And here's some amazing content. It's very engaging. Right?">Click to toggle popover</button>

Answer 2

将类添加到您的弹出框，然后为该类添加新的 css 规则：

.popover-class {

   color: black;

}