javascript - 在使用 JS/jQuery 操作后，将 CSS 样式导出到单独的 .css 文件中？

Question

我必须使用 HTML5/JS/jQuery/CSS 创建自定义的基本 SVG 编辑器。
编辑器的输入是两个文件 x.svg 及其关联的 x.css 文件。

x.svg 将加载到 HTML 页面中，并应用 x.css 中的样式。然后像 stroke, width... 这样的样式将使用 JS/jQuery 进行操作，到目前为止一切正常。

我的问题是，在用户对样式进行了一些更改并希望将这些更改永久保存在 x.css 文件中后，我不知道该怎么做，我可以编写属性:值很容易与文件配对，但 x.css 文件有选择器、大括号等……程序的输出应该是一个探测器 x.css 文件，请注意 x.svg 将保持不变。这个问题怎么处理，没有代码的详细思路就够了，谢谢。

Answer 1

好的，这就是答案，我是在 Eli grey 的 FileSaver.min.js 和 BlobBuilder.min.js 的帮助下实现的，该函数附加到 anchor 元素的单击事件，当用户单击时出现对话框，要求您插入文件名和存储位置。在 Chrome 23 上测试，在版本 24 上它不起作用。

function exportCSS() 
{

//stop anchor link from taking us anywhere
event.preventDefault();
//index is chosen for test sofar, need next to iterate over all sSheets and pick the right one depending on svg file name
sSheet = document.styleSheets[2];
myRules = sSheet.cssRules;
len = myRules.length;
for (i = 0; i < 50; i++) {
    cssOutputString = cssOutputString + myRules[i].cssText + "\n";
}
console.log(cssOutputString);

//save the file
var blob = new Blob([cssOutputString]);

saveAs(blob, "file.css");
}