Question

有没有办法将粘贴到textarea中的CSS注入/附加到页面的head部分？我正在为应用程序创建设置页面，我想通过将CSS添加到textarea然后单击“保存”来允许主题和选项来更改次要内容。

其他选项：让textarea显示名为“theme.css”的文件是否可行，然后所做的任何更改都将保存为该文件。要完全更改主题，只需将新的主题直接复制/粘贴到文本框中即可。

Answer 1

如果你使用jquery，你可以这样做

<script>
$("head").append("<style>body {background:blue;}</style>");
</script>

作为另一种选择

您可以使用fread阅读theme.css文件，在textarea中显示并使用fwrite将其保存到文件。

Answer 2

那样的东西？

<!doctype html>
<html>
<head>
<script type='text/javascript'>
    function addStyle(css){
        var stl = document.createElement('style');
        stl.innerHTML = css;
        document.getElementsByTagName('head')[0].appendChild(stl);
    }
</script>
</head>
<body>
<p>Paragraph To Test<p>
<textarea id="txtarea">p{color:red;}</textarea>
<input type="button" value="Set Style" onclick="addStyle(txtarea.value);">
</body>
</html>

使用textarea注入CSS？

2 个答案: