下面是一个将文件导出为ZIP的教程:

在开始之前，有一个库来保存文件，库的名字是filesver .js，你可以在这里找到这个库。让我们开始吧，现在，包括所需的库:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.4/jszip.min.js"  type="text/javascript"></script>
<script type="text/javascript" src="https://fastcdn.org/FileSaver.js/1.1.20151003/FileSaver.js" ></script>

现在复制这段代码，这段代码将下载一个带有Hello .txt文件的zip文件，其中包含Hello World的内容。如果一切正常，这将下载一个文件。

<script type="text/javascript">
    var zip = new JSZip();
    zip.file("Hello.txt", "Hello World\n");
    zip.generateAsync({type:"blob"})
    .then(function(content) {
        // see FileSaver.js
        saveAs(content, "file.zip");
    });
</script>

这将下载一个名为file.zip的文件。你可以在这里阅读更多:http://www.wapgee.com/story/248/guide-to-create-zip-files-using-javascript-by-using-jszip-library

简单的解决方案!

<a download=“My-FileName.txt” href=“data：application/octet-stream，HELLO-WORLDDDDDDDD”>点击这里</a>

适用于所有现代浏览器。

对于像“txt”或“js”这样的简单文件，您可以使用fs-浏览器包。 它有很好的和简单的下载和导出方法的客户端，不涉及任何服务器。

import {exportFile} from 'fs-browsers'; const onExportClick = (textToExport) => { //导出到txt文件 exportFile (textToExport); ｝

如果你想改变文件的名称，甚至它的类型，你可以很容易地用这个:

import {exportFile} from 'fs-browsers'; const onExportClick = (textToExport) => { //导出到js文件file.js exportFile(textToExport， {fileName: 'file.js'}); ｝

对于更复杂的文件，您将需要使用服务器。 如果这是你需要的，这个包也可以对excel文件('xls')这样做。

import {exportFile, EXCEL_FILE} from 'fs-browsers'; 常量数据= [{" id ": 5,“名字”:“约翰”,“等级”:90年,“年龄”:15},{" id ": 7,“名字”:“尼克”、“年级”:70年,“年龄”:17}); const heading =["学号"，"学生姓名"，"考试等级"，"学生年龄"]; exportFile(数据，{类型:EXCEL_FILE，标题:标题，文件名:'grades.xls'});

也许将来还会有其他类型的文件。

下面是一个将文件导出为ZIP的教程:

在开始之前，有一个库来保存文件，库的名字是filesver .js，你可以在这里找到这个库。让我们开始吧，现在，包括所需的库:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.4/jszip.min.js"  type="text/javascript"></script>
<script type="text/javascript" src="https://fastcdn.org/FileSaver.js/1.1.20151003/FileSaver.js" ></script>

现在复制这段代码，这段代码将下载一个带有Hello .txt文件的zip文件，其中包含Hello World的内容。如果一切正常，这将下载一个文件。

<script type="text/javascript">
    var zip = new JSZip();
    zip.file("Hello.txt", "Hello World\n");
    zip.generateAsync({type:"blob"})
    .then(function(content) {
        // see FileSaver.js
        saveAs(content, "file.zip");
    });
</script>

这将下载一个名为file.zip的文件。你可以在这里阅读更多:http://www.wapgee.com/story/248/guide-to-create-zip-files-using-javascript-by-using-jszip-library

你可以用它来保存文本和其他数据:

function downloadFile(name, data) {
    let a = document.createElement("a");
    if (typeof a.download !== "undefined") a.download = name;
    a.href = URL.createObjectURL(new Blob([data], {
        type: "application/octet-stream"
    }));
    a.dispatchEvent(new MouseEvent("click"));
}

这个函数将创建一个Anchor元素，通过.download(如果支持的话)设置名称，分配一个从对象(url . createobjecturl)创建的url (.href)，在本例中是一个Blob对象，并分派一个单击事件。简而言之:就好像你在点击一个下载链接。

示例代码

downloadFile("textfile.txt", "A simple text file");
downloadFile(
    "circle.svg",
    `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
        <circle cx="50" cy="50" r="42" />
    </svg>`
);
downloadFile(
    "utf8string.txt",
    new Uint8Array([85, 84, 70, 45, 56, 32, 115, 116, 114, 105, 110, 103]) // "UTF-8 string"
);

这个函数也接受File, Blob和MediaSource:

function downloadFile(name, data) {
    if (!(data instanceof File || data instanceof Blob || data instanceof MediaSource)) {
        return downloadFile(name, new Blob([data], {
            type: "application/octet-stream"
        }));
    }

    let a = document.createElement("a");
    if (typeof a.download !== "undefined") a.download = name;
    a.href = URL.createObjectURL(data);
    a.dispatchEvent(new MouseEvent("click"));
}

或者你可以使用两个函数:

function downloadFile(name, data) {
    return downloadObject(new Blob([data], {
        type: "application/octet-stream"
    }));
}

function downloadObject(name, object) {
    let a = document.createElement("a");
    if (typeof a.download !== "undefined") a.download = name;
    a.href = URL.createObjectURL(object);
    a.dispatchEvent(new MouseEvent("click"));
}

在测试“ahref”方法时，我发现Firefox和Chrome的web开发工具很容易混淆。我需要在a.click()发出后重新启动调试。FileSaver也发生了同样的情况(它使用相同的ahref方法进行实际保存)。为了解决这个问题，我创建了一个新的临时窗口，将元素a添加到其中，并单击它。

    function download_json(dt) {
        var csv = ' var data = ';
        csv += JSON.stringify(dt, null, 3);

        var uricontent = 'data:application/octet-stream,' + encodeURI(csv);

        var newwin = window.open( "", "_blank" );
        var elem = newwin.document.createElement('a');
        elem.download = "database.js";
        elem.href = uricontent;
        elem.click();
        setTimeout(function(){ newwin.close(); }, 3000);
        
    }