使用Blod将数据变为文件保存至本地
const d = {
a: 1,
name: '这是测试文件'
}
const elementA = document.createElement('a'); // 创建一个a标签用于下载
elementA.download = ‘test.txt’; // 设置要保存文件的名称
elementA.style.display = 'none'; // 将a标签隐藏 防止影响页面,根据情况来定义
const blob = new Blob([JSON.stringify(d)]); // 使用Blob对象将数据转换为类文件对象
// 关于Blob对象的使用方式可以参考
// https://developer.mozilla.org/zh-CN/docs/Web/API/Blob
elementA.href = URL.createObjectURL(blob); // 将Blob类文件对象转换成包含文件信息的URL,并设置进a标签
// 将a标签添加到DOM并触发点击事件就能将数据下载下来
document.body.appendChild(elementA);
elementA.click();
document.removeChild(elementA);
关于内存
在每次调用 createObjectURL()
方法时,都会创建一个新的 URL 对象,即使你已经用相同的对象作为参数创建过。当不再需要这些 URL 对象时,每个对象必须通过调用 URL.revokeObjectURL()
方法来释放。
浏览器在 document 卸载的时候,会自动释放它们,但是为了获得最佳性能和内存使用状况,你应该在安全的时机主动释放掉它们。