使用JavaScript修改Less文件

Using JavaScript to change Less files

本文关键字：文件 Less 修改 JavaScript 使用      更新时间：2023-09-26

我想用JavaScript更改Less文件的属性。这是我的代码

document.getElementsByClassName('content-main--inner').style.border = '1px solid yellow!important';

我试过用!important和没有它。

但是这不起作用，属性没有改变。我认为问题在这里:

('content-main--inner')

是否可以用JavaScript操作Less文件?

getElementsByClassName返回一个nodeList，而不是单个元素，您必须迭代

var elems = document.getElementsByClassName('content-main--inner');
for (var i=elems.length; i--;) {
    elems[i].style.border = '1px solid yellow';
}

注意!important不能在javascript或内联样式中设置

用js修改less文件对你没有任何好处，因为当你修改文件时，它已经被翻译成css

有人评论说，getElementsByClassName返回一个nodeList，这意味着您需要执行以下操作来修改第一个元素

document.getElementsByClassName('content-main--inner')[0].style.border = '1px solid yellow !important';

或者如果你想修改所有元素的content-main--inner

类
var elements =  document.getElementsByClassName('content-main--inner')
for( var i = 0; i < elements.length; i++) {
     elements[i].style.border = '1px solid yellow !important';
}
相关文章：