如何将 CSS 样式添加到 javascript答案

【问题标题】：How to add CSS styles to javascript如何将 CSS 样式添加到 javascript
【发布时间】：2014-03-12 00:58:22
【问题描述】：

快速免责声明 - 我是 javascript 新手。我正在研究如何将 CSS 样式添加到 javascript 变量中。这是我的代码的链接。

我想做的是能够格式化计数器中的动态数字。这是我曾经尝试这样做的代码

var days = document.getElementById("days");
    days.style.color = "blue";

但这并没有做任何事情。请帮我。我想知道如何添加其他格式，例如字体大小。

请理解，我可以使用“倒计时”getElementById 将样式添加到所有 javascript。但我想专门针对变量。救命！！！

【问题讨论】：

从你的 JSFiddle 来看，实际上并没有一个叫做 Days 的元素，这就是为什么你不能给它分配颜色
你的代码中没有id为days的元素
你可以在这个小提琴中看到，通过将你想要的文本包装在 span 和 id="days" 中，你可以解决你的问题：jsfiddle.net/Ehney/169 如果你想这样做，我建议使用一个类到值以及天标签。

标签： javascript jquery html css variables

【解决方案1】：

用 id/class 将变量值包装在一个跨度中

document.getElementById('countdown').innerHTML = 'Days ' + 'Hours ' + 'Minutes ' + 'Seconds  </br> &nbsp <span id="days">' + days + '</span>&nbsp &nbsp &nbsp &nbsp<span id="hours">' + hours + '</span>&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp<span id="minutes">' + minutes + '</span> &nbsp &nbsp &nbsp &nbsp &nbsp<span id="seconds">' + seconds + '</span>';

然后定义css规则

#days {
    color: blue;
}

演示：Fiddle

【讨论】：

谢谢，这很好。我能够添加任何我想要的 CSS 样式

【解决方案2】：

你可以这样做：

var css = document.createElement("style");
css.type = "text/css";
css.innerHTML = "strong { color: red }";
document.body.appendChild(css);

【讨论】：