目前總結有四個方法；
1.新建style標簽，寫上樣式 覆蓋掉之前的樣式；
2.css中使用var變量，然后通過 CSSStyleDeclaration.setProperty()設置變量的值；注意css中變量的作用域 只能是當前元素及子元素；
例如：
index.css
#box{
color: var(--color);
}
index.js
document.getElementById("box").style.setProperty("--color","red");
3.css中 attr（）；
兼容性不好。
CSS函數attr()是用來獲取被選中元素的屬性值，並且在樣式文件中使用。它也可以用在偽類元素里，在偽類元素里使用，它得到的是偽元素的原始元素的值。
attr()函數可以和任何CSS屬性一起使用，但是除了content外，其余都還是試驗性的（簡單說就是不穩定，瀏覽器不一定支持）。
例如 ：
index.css
#box{ color:attr(data-color) }
index.js
document.getElementById("box").dataset.color = "red";
4.通過cssStyleSheet修改樣式表；不太靈活，不同環境獲取樣式表的方式不同，可能開發環境是style標簽，生產環境就是 link標簽了。
tip：方法2,3,的兼容性還需查詢caniuse，方法4不太靈活
參考文章：css中的var的作用域；