1

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

x.svg 将加载到 HTML 页面中,并应用来自 x.css 的样式。然后像描边、宽度...这样的样式将使用 JS/jQuery 进行操作,到目前为止一切都很好。

我的问题是,在用户对样式进行了一些更改并希望将这些更改永久保存在 x.css 文件中之后,我不知道该怎么做,我可以轻松地将属性:值对写入文件,但是x.css 文件有选择器、大括号等...程序的输出应该是一个探测器 x.css 文件,注意 x.svg 将保持不变。我该如何处理这个问题,没有代码的详细想法就足够了,谢谢。

4

2 回答 2

1

好的,这就是答案,我在 Eli gray 的 FileSaver.min.js 和 BlobBuilder.min.js 的帮助下实现了它,该功能附加到锚元素的单击事件,当用户单击时会出现一个对话框,询问你插入文件名和存储位置。在 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");
}
于 2013-01-16T13:20:15.183 回答
0

出于安全原因,您不能使用 Javascript 将文件保存到客户端的硬盘上。

于 2012-12-04T16:31:55.257 回答