JS创建的style样式怎么使用变量？

Question

我有几个样式需要用JS去改变，因为还需要改变CSS伪类的样式，所以我得用JS创建style插入标签里面，然后在style里面写入要改变的样式，可是style里面的样式不能使用变量，而我现在的问题是样式的值必须使用变量？

代码如下：

$('html').append("<style>.className:after{background:red;border-color:green}</style>");

现在样式的值只能直接写，而我想要样式的值可以使用变量，比如：

var bgColor = red,

    borderColor = green;

$('html').append("<style>.tanmu-contain-171208 .tanmu-content-171208{.className:after{background:bgColor;border-color:borderColor}</style>");

能实现吗？还有其他的方法实现吗

Answer 1

es6 字符串拼接var bgColor = red,borderColor&nbsp;=&nbsp;green;$('html').append(<style>.tanmu-contain-171208 .tanmu-content-171208{.className:after{background:${bgColor};border-color:${borderColor}}</style>);