将 css 代码附加到 <style>答案

【问题标题】：Append css code to <style>将 css 代码附加到 <style>
【发布时间】：2013-08-02 14:06:58
【问题描述】：

我正在尝试将 css 代码附加到 <style>。

我已经有<style>，其中有id，比如<style id="custom-css">，我想在单击按钮时附加更多样式。

$('.btn').click(function(){
    $('.class{background:#aaa;}').appendTo('custom-css');
});

【问题讨论】：

标签： jquery

【解决方案1】：

不知道您为什么需要这样做，因为您似乎可以通过提前设置规则并添加和删除另一个类来打开和关闭它，但是：

$('#custom-css').append('.class{background:#aaa;}');

更好的方法是提前设置规则：

<style>
.class {background:none;}
.class.toggleOn {background:#aaa;}


</style>

然后是一些类似的脚本

$('.class').someEvent(function(){
    $(this).toggleClass('toggleOn');
});

【讨论】：

【解决方案2】：

可以这样做：

$('#custom-css').html(function (i, m) {
    return m+'.class{background:#aaa;}';
});

HTML：

<style id="custom-css">
    .class-1{background:#aaa;}
</style>
<div class="class-1">HDUYD7DY</div>
<div class="class">F8HR</div>

但是，我建议不要使用这种方法，而是使用：

$('.class').css('background', '#aaa');

在不知道该风格的情况下，很难推荐一个真正的替代品。

【讨论】：