使用js更改CSS全局变量

Question

@Color1 = #fff;
@Color2 = #b00;

h1 {
  color:@Color1;
  background:@Color2;
}

如何使用JS更改@Color1和@Color2 ？ 这是我的示例代码。

要么

.chat-wrapper .chat-message.chat-message-sender .chat-message-wrapper:before {
    right: -20px;
    border-left-color: #8AC0D9;
}

如何到达左边框的JavaScript代码？ 我有一个动态变化的颜色值。 我必须应用这个。 我该怎么做 ？

编辑

main.css //这是我的CSS文件@Álvaro-gonzález

.chat-wrapper .chat-message.chat-message-sender .chat-message-wrapper,
.chat-wrapper .chat-message.chat-message-sender .chat-message-content {
    float: right;
}
.chat-wrapper .chat-message.chat-message-sender .chat-message-wrapper:before {
    right: -20px;
    border-left-color: #8AC0D9;
}

Answer 1

这是您问题的答案。 因此，如果您想更改链接问题中任何变量的值，则需要执行以下操作：

document.styleSheets[0].rules[0].style.setProperty("--red", "#FF0000");

当然，必须仔细检查数组的索引以进行迭代以找到相应的选择器