使用JavaScript創建預製CSS變量

Question

假設我正在處理大型頁面。我想在JavaScript中預先定義一些CSS樣式作爲變量，以後可以使用它們。可能嗎？語法是什麼？

我試圖做這樣的事情：

var box = document.querySelector('.box'); 
var styleColor = style.color; 
var red = "red" 

box.onclick = function(){styleColor.red;} 

我知道你可以做到這一點是這樣的：

var box = document.querySelector('.box'); 

box.onclick = function(){box.style.color = "red";} 

但我想緩存CSS所以可以稍後重新使用。這是可能的，如果是這樣的話，語法會是什麼樣子？

Answer 1

在正常的css文件中寫下你的css。例如：

.myRedClass { color: red; } 

類然後附加到元素，你想在JavaScript紅色如下

var element = document.getElementById(elementId); 
element.className += " " + "myRedClass";