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

【问题标题】：Django: Change font-color inside a javascript-functionDjango：在 javascript 函数中更改字体颜色
【发布时间】：2020-05-01 09:34:09
【问题描述】：

早安，

我的 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 中的字体颜色更改为黑色？

谢谢大家！

【问题讨论】：

标签： javascript python css django colors

【解决方案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>

【讨论】：

【解决方案2】：

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

.popover-class {

   color: black;

}

【讨论】：