使用JavaScript创建和下载文本文件
最近我的项目里需要用JavaScript创建和下载文本文件的功能，例如，在笔记里，我想导出我的书签为一个Json文件，我需要导出笔记为一个文本文件。
我用下面的JavaScript函数创建和下载各种类型的文件。
function saveTextAsFile(textToWrite, fileNameToSaveAs, fileType) {
let textFileAsBlob = new Blob([textToWrite], { type: fileType });
let downloadLink = document.createElement('a');
downloadLink.download = fileNameToSaveAs;
downloadLink.innerHTML = 'Download File';
if (window.webkitURL != null) {
downloadLink.href = window.webkitURL.createObjectURL(
textFileAsBlob
);
} else {
downloadLink.href = window.URL.createObjectURL(textFileAsBlob);
downloadLink.style.display = 'none';
document.body.appendChild(downloadLink);
}
downloadLink.click();
}
这个函数非常简单，接受三个参数
- 要写入的文本
- 文件的名称
- 文件类型
函数内根据传入的文本文件类型创建一个 Blob 对象，然后创建一个 a 标签，根据参数文件的名称 给 a 标签设置 download 属性
接着 看 window 下是否存在 webkitURL 对象，如果存在，就调用它的createObjectURL函数，为 Blob对象 创建一个 URL 对象，如果没有webkitURL 对象，就使用 URL.createObjectURL() 为 Blob对象 创建一个 url对象。
接着 将创建的 url对象 设置到 a 标签的 href 属性上，并将 a 标签添加到 body 上，然后模拟点击一下。
所以如果你想用JavaScript创建和下载一个文本文件，你可以使用上面的函数，例如，你想创建一个名称为 hello.txt ，内容为 Hello World! 的文本文件，可以这样使用：
saveTextAsFile('Hello World!', 'hello.txt', 'text/plain');
同样，你想创建和下载一个名为 hello.json ，内容为{"hello": "world"}的json文件，可以这样使用：
saveTextAsFile('{"hello": "world"}', 'hello.json', 'application/json');
可以点击here，体验demo。
当然以上只是一个基础的函数，可以根据不同状况进行扩展。
tips:
- 除了IE-11和Opera-Mini，它可以在所有浏览器上运行。
- 任何下载都可能被客户端阻止，运行任何下载功能都不能保证下载成功，也没有任何方法可以用来发现下载是否已经完成或甚至已经开始.
