После использования cssRules для изменения значения пользовательской переменной обновление не отражается - PullRequest
Новая
       55

После использования cssRules для изменения значения пользовательской переменной обновление не отражается

0 голосов
/ 14 июля 2020

Я пытаюсь изменить настраиваемое свойство в правиле таблицы стилей с помощью CSSOM. 

const cssRule = document.styleSheets[0].cssRules[0]

function changeColor() {
  console.log(cssRule.style["--color"])
  cssRule.style["--color"] =
    cssRule.style["--color"] === "red" ? "blue" : "red"
  cssRule.style.color = cssRule.style["--color"] // ★
}
p {
  --color: green;
  color: var(--color);
}
<p>The color.</p>
<button onclick="changeColor()">Change the color</button>

Но проблема возникает, когда строка с // ★ закомментирована.

Почему это так? Есть ли другой способ запустить браузер для обновления свойств (как в инспекторе инструмента разработчика)?

...