如何使用 Javascript 更改 CSS 变量 unicode？

Question

我在元素上有一个 CSS 变量。

<div style="--background:example"></div>

CSS 变量在 jQuery 和

中动态更改

$("div").css("--background",newValue)

在 CSS 本身，我可以让背景从伪元素动态变化，如下所示：

div::after {
    content: '';
    background: var(--background);
}

这工作正常 - 但是，我怎样才能将变量更改为不同的 unicodes?

例如，如果我将 newValue 设置为 \f099，jQuery 将其作为 99 传递。

我也试过 \f099，但在通过之前被格式化为文字 unicode，因此没有应用效果。

如果我使用 \f099，CSS Inspector 将 CSS 变量的值显示为一个框（就像一个实际的 unicode）。

如果我在 CSS 文件中手动设置 unicode，即使在检查器中也能正常显示

Answer 1

我假设您想将 content 设置为 \f099。

content 的值必须用引号括起来，并且必须转义反斜杠。执行以下操作：

$("div").css("--content", '"\f099"')

这会将变量设置为 "\f099"。

How to change a CSS variable unicode using Javascript?