如何使用javascript设置SASS变量

问题描述：

我想在CSS中使用sass css设置全局变量。必须使用javascript设置全局变量。如何使用JavaScript或任何其他方法设置变量我已经使用root css，但不支持IE浏览器。以下是我的CSS如何使用javascript设置SASS变量

$mainbgimage: image url; 
.page-title { 
padding: 0; 
min-height: 200px; 
background-image: $mainbgimage; 
}

这是不可能从JS –

设置SASS的可变股票代码，以便我们可以告诉你一个你想达到的解决方法，因为你所要求的是不可能的。 –

你可以用javascript动态设置CSS，但scss不能。 SCSS需要一个转译器将其转换为CSS。 – Pommesloch

答

SCSS和等预处理语言。他们带来的功能（如变量），使其更容易开发和维护您的风格。但是，这些功能不受vanilla CSS支持，您需要运行预处理器（SASS）来生成浏览器支持的CSS。

由此产生的CSS没有变量，因此您不能直接更改它们与客户端JavaScript。

但幸运的是，您有很多动态样式的选项。我总是建议切换，像这样的CSS类：

document.getElementById('elementId').classList.add('specialStyleClass'); 

/* ... */ 

document.getElementById('elementId').classList.remove('specialStyleClass');

你甚至可以从JavaScript设置元素的样式直接：

document.getElementById('elementId').style.color = 'red';

如何使用javascript设置SASS变量

相关推荐