jquery - 使用 jQuery 更改标记和不同 CSS 文件的 CSS 属性

Question

我有一个 HTML 标记，并且有几个 CSS 文件，这些文件为 HTML 元素分配了不同的属性，这些元素将充当标记的主题。假设标记类似于

<div id=main>
    <div>{More HTML elements, divs, spans etc}</div>
    <div>{More HTML elements, divs, spans etc}</div>
</div>

CSS 就像

/*first.css*/
#main{
    someProperty: values;
}

#main div, #main ul li {
    someProperty: values;
}

另一个CSS文件

/*second.css*/
#main{
    someProperty: some other values;
}

#main div, #main ul li {
    someProperty: some other values;
}

还有更多具有不同属性和值的 css 文件。

我想要做的是，通过单击按钮，我想更改标记的 CSS，而不更改标记。所以它会是这样的

$('.btn').click(function(){
    var file = $(this).attr('id');
    //remove the previous css file
    //add the new css file (filename is the js var file+'.css')
});

我无法继续执行 $('#someId').css({/* properties */}); 因为 CSS 文件中有很多属性。

那么我该如何最好地处理这个问题？

Answer 1

我想说你可以在不同的类中使用具有不同属性的单个 css。每当你想改变什么的时候。只需使用 .removeClass() 删除当前类即可并使用 .addClass() 添加新类.

如果你想切换 css 文件。看看here