如何将包含XML的Javascript变量的内容保存到本地磁盘?
问题的原因是作者想要将包含XML的Javascript变量保存到本地磁盘上。为了解决这个问题,作者提供了一个不使用jQuery或其他库的解决方案。
解决方法如下:
1. 首先,定义一个名为`save`的函数,该函数接受文件名和数据作为参数。
2. 使用`Blob`对象创建一个包含数据的Blob实例,设置其类型为"text/csv"。
3. 检查浏览器是否支持`window.navigator.msSaveOrOpenBlob`方法,如果支持,则调用该方法将Blob保存为文件。
4. 如果不支持`msSaveOrOpenBlob`方法,则创建一个``元素。
5. 将``元素的`href`属性设置为通过`window.URL.createObjectURL`方法创建的Blob的URL。
7. 将``元素添加到文档的`body`元素中。
8. 触发``元素的点击事件。
9. 将``元素从文档的`body`元素中移除。
在Chrome中,实际上不需要将元素附加到`body`元素上即可使其工作。
需要注意的是,浏览器有一个大小限制,Chrome浏览器的限制是2MB。如果需要处理更大的文件,需要考虑其他的解决方案。
在Firefox 48上,移除``元素后调用`revokeObjectURL()`方法会导致下载窗口永远不会出现,下载也不会开始。移除对`revokeObjectURL()`方法的调用可以解决这个问题。
对于AngularJS 1.x应用程序,可以在创建URL时将其添加到一个数组中,并在组件的$onDestroy函数中清除这些URL。
为了解决将包含XML的Javascript变量保存到本地磁盘上的问题,可以使用上述提供的解决方案。该解决方案适用于IE 10+、Firefox和Chrome浏览器,并且不需要使用jQuery或其他库。需要注意的是,在某些情况下,可能需要在移除元素后调用`URL.revokeObjectURL`方法来释放对象URL。
如何将JavaScript变量(包含XML)的内容保存到本地磁盘?
问题的出现原因:用户想要将JavaScript变量中的XML内容保存到本地磁盘。
解决方法:可以使用数据URI。浏览器的支持程度有所不同。示例如下:
text file
octet-stream是为了强制下载提示。否则,它可能会在浏览器中打开。
对于CSV文件,可以使用以下方式:
CSV Octet
可以尝试jsFiddle演示。
这不是一个跨浏览器的解决方案,但绝对值得一看。例如,IE的支持限制在数据URI上。IE 8的大小限制为32KB,而IE 7及更低版本根本不支持。
是的,在任何IE版本中都无法使用这种方法,因为数据URI在a元素中不被允许。
在Chrome版本19.0.1084.46中,此方法会生成以下警告:“资源被解释为文档,但以MIME类型text/csv传输:“data:text/csv,field1%2Cfield2%0Afoo%2Cbar%0Agoo%2Cgai%0A”。不会触发下载。
是的,显然它在Chrome中不起作用,即使使用octet-stream也不行。
它现在在Chrome中可以工作(测试了v20和v21),但在IE9中不起作用(可能只是jsFiddle的问题,但我对此表示怀疑)。
我接受这个答案,因为似乎没有其他方法可以实现这一点...
在ie8和ie9中不起作用,因为这些浏览器只支持图像的数据URI。
正如naren在他的答案中指出的那样,Firefox需要在文档中存在链接才能进行下载。
在Safari(7.0.4)中根本不起作用。另外,到Chrome 36.0.1985.97 beta为止,似乎无法使用下载属性为文件命名。
而且,在Chrome 37.0.2062.120中,当base64字符串过长时,浏览器会崩溃。
我像是-谁能以维基百科的方式链接到浏览器兼容性-哦,好吧 🙂
正确的字符集几乎肯定是UTF-16,除非你有将其转换为UTF-8的代码。JavaScript在内部使用UTF-16。如果你有一个文本或CSV文件,请使用'\ufeff'开始字符串,这是UTF-16BE的字节顺序标记,文本编辑器将能够正确读取非ASCII字符。
好的观点。可以制作UTF-8的数据URL(我的示例就是一个),但制作UTF-16的可能更容易。但从技术上讲,JavaScript更接近于UCS-2。
数据URI有大小限制吗?
是的,至少在某些浏览器中(例如IE 8)。
是否有办法为src是数据URI的图像提供一个可理解的名称?
在Samsung浏览器(默认移动浏览器)中不起作用。
只需添加download="txt.csv"属性,以便拥有正确的文件名和扩展名,并告诉操作系统如何处理它。
而且还有一个大小限制。据说对于Chrome,限制为2MB。
在Chrome上效果很好。base64似乎是传递PDF文件的最佳解决方案 🙂
使用download="filename.txt"属性和javascript .click()方法,可以自动化该过程。
在Microsoft Edge 40.15063.674.0和Internet Explorer 11.674.15063.0中不起作用。我使用了来自的答案,它可以工作。
我正在尝试使用这种方法将textarea的值作为文本文件下载,但是在下载的文本文件中,textarea中的换行符没有显示出来。有什么建议吗?这是我如何形成href的方式:'data:application/octet-stream,' + encodeURIComponent(document.getElementById("editor").value).replace("\n","%0A")。(我添加了replace函数,希望那可能是问题所在)。
在Firefox中不再起作用;顶级数据URI已被阻止以确保“安全性”。
如何将包含XML的Javascript变量的内容保存到本地磁盘?
这个问题的原因是,用户希望将Javascript变量中的XML内容保存到本地磁盘,以便将其用作本地文件。
解决方法是使用HTML5的新特性,在支持HTML5的浏览器中可以简单地实现。以下是解决方法的代码示例:
function download(filename, text) { var element = document.createElement('a'); element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text)); element.setAttribute('download', filename); element.style.display = 'none'; document.body.appendChild(element); element.click(); document.body.removeChild(element); }
此外,还可以使用HTML、CSS和Javascript的组合来实现更复杂的功能。以下是一个示例表单,当提交时调用`download`函数并传递文件名和文本内容:
用户可以在表单中输入文件名和文本内容,然后点击“Download”按钮将文件保存到本地磁盘。
总结起来,要保存Javascript变量中的XML内容到本地磁盘,可以使用HTML5的新特性,在支持HTML5的浏览器中实现。通过创建一个``元素,并设置其`href`属性和`download`属性,然后将该元素附加到页面上并通过调用`click`方法触发下载操作,最后将元素从页面中移除即可实现保存文件到本地磁盘的功能。