将颜色从CSS传递到Javascript

我将我的主题颜色定义为CSS文件中的变量。然后我想在JavaScript中使用相同的颜色（它从数据库中获取值并生成图形）。我不想在JS中再次指定颜色。我可以从CSS加载颜色列表吗？如果可以，如何加载

CSS文件：

/* http://www.colorhunt.co/c/43601 */
:root{
    --maincolor: #113f67;
    --secondcolor: #34699a;
    --thirdcolor: #408ab4;
    --fourthcolor: #65c6c4; 
}

---

将变量应用于主体，然后使用

var bodyStyles=window.getComputedStyle（document.body）

这将返回主体上定义的所有样式的对象，现在可以使用

var varName=bodyStyles.getPropertyValue（'--var name'）

其中varName现在包含变量，要对所有颜色执行此操作：

var bodyStyles = window.getComputedStyle(document.body);
var colors = ['--maincolor', '--secondcolor', '--thirdcolor', '--fourthcolor'];
var colorValues = [];

for (var i = 0; i < colors.length; i++) {
    colorValues.push({'name': colors[i], 'hex': bodyStyles.getPropertyValue(colors[i])})
}

var bodyStyles=window.getComputedStyle（document.body）；
var colors=['--maincolor'，'--secondcolor'，'--thirdcolor'，'--fourthcolor']；
var colorValues=[]；
对于（变量i=0；i
为什么不从javascript中反转并设置颜色？@Bálint，因为这些是整个网站的主颜色。我稍微调整了一下您的解决方案，因为我更喜欢名称而不是索引，所以最终使用字典而不是列表：colorValues[colors[I]=bodyStyles.getPropertyValue（colors[I]）；