我想做什么：
＆＃xA;＆＃xA;我想在＆lt; style＆gt;中添加规则并修改现有规则标记有javascript / jQuery。
为什么我要这样做：
＆＃xA;＆＃xA ;我基本上是在构建一个配色方案编辑器，当用户更改表单中的值时，我想更新CSS以反映这种变化。
＆＃xA;＆＃xA;我尝试了什么：
＆＃xA;＆＃xA;用JS函数生成的CSS替换整个＆lt; style＆gt; 标记。这可行但似乎很多处理只是一个非常小的变化。
此外，我还可以创建包含特定CSS类的容器＆lt; div＆gt; ，只需查找/替换其HTML。例如：
＆lt; div id =“button_background_cont”＆gt;＆＃xA; ＆lt; style type =“text / css”＆gt; .buttons {background-color：＃333333;}＆lt; / style＆gt;＆＃xA; ＆LT; / DIV＆GT;＆＃XA;＆＃XA; ＆lt; div id =“button_color_cont”＆gt;＆＃xA; ＆lt; style type =“text / css”＆gt; .buttons {color：#ffffff;}＆lt; / style＆gt;＆＃xA; ＆lt; / div＆gt;＆＃xA; ＆＃xA;＆＃xA; 这些都有效......但是真的很笨重，我并不特别喜欢它们。
＆＃xA;＆＃xA;我需要做的示例：
＆＃xA;＆＃xA; ＆lt; style type =“text / css”id =“color_scheme”＆gt;＆＃xA; .buttons {背景：＃333333;颜色：#ffffff;}＆＃xA;＆lt; / style＆gt;＆＃xA;＆lt;输入名称=“button_background”id =“button_background”value =“＃333333”/＆gt;＆＃xA;＆lt;输入名称= “button_color”id =“button_color”value =“＃ffffff”/＆gt;＆＃xA; ＆＃xA;＆＃xA; 更改表单元素并使其成为以下< / p>＆＃xA;＆＃xA;
＆lt; style type =“text / css”id =“color_scheme”＆gt;＆＃xA; .buttons {background：#ff0000;颜色：＃333333;}＆＃xA;＆lt; / style＆gt;＆＃xA;＆lt; input name =“button_background”id =“button_background”value =“＃ff0000”/＆gt;＆＃xA;＆lt; input name = “button_color”id =“button_color”value =“＃333333”/＆gt;＆＃xA; ＆＃xA;＆＃xA; 有什么想法吗？
＆＃XA;答案 0 :(得分：3)
这将是一种基本的方法，您可能会找到一种更好的方式来生成样式字符串，但它看起来像这样：
function generateStylesContent(){
var btnBgr = $("#button_background").val();
var btnColor = $("#button_color").val();
var stylesPlaceholder = ".buttons{background:[BACKGROUND];color:[COLOR];}";
var newGeneratedStyles = stylesPlaceholder
.replace("[BACKGROUND]", btnBgr)
.replace("[COLOR]", btnColor)
$('#color_scheme').text(newGeneratedStyles);
};
$('.buttons').on('click', function(){
generateStylesContent();
})
更新
答案 1 :(得分：0)
你可以用以下方式使用j-query来实现它
$("#button_background").css("color",'blue')
答案 2 :(得分：0)