Javascript:: 导出到文本文件 [英] Javascript:: export to text file

查看:26
本文介绍了Javascript:: 导出到文本文件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

<!DOCTYPE html>
<html>

<head>
    <title>&nbsp;</title>
    <meta charset=utf-8>
</head>

<body>

    <table>
        <tr>
            <th>A</th>
            <th>B</th>
            <th>C</th>
        </tr>
        <tr>
            <td>Line #1</td>
            <td>SLTD</td>
            <td>32</td>
        </tr>
        <tr>
            <td>Line #2</td>
            <td>MKTD</td>
            <td>68</td>
        </tr>
        <tr>
            <td>Line #3</td>
            <td>LRTD</td>
            <td>55</td>
        </tr>
        <tr>
            <td>Line #4</td>
            <td>HAD</td>
            <td>47</td>
        </tr>
    </table>

    <button>Export to text file</button>

    <script>
        var theFirstChilds = document.querySelectorAll('table tr td:first-of-type'), text, i;

        text = "";

        for (i = 0; i < theFirstChilds.length; ++i) {
            text = text + theFirstChilds[i].innerText;
        }

        console.log(text);

        var button = document.getElementsByTagName("button")[0];

        button.addEventListener("click", function() {
            //alert("I want to export the variable text [console.log(text)] to text file");
        });
    </script>

</body>

</html>

一切正常...剩下的就是将其导出到文本文件...

Everything is working properly... The only thing that left is to export it to a text file...

iow... 变量 text 中的所有内容都将保存到文本文件中...

iow... everything in the variable text would be saved to text file...

单线解决方案将是完美的:)

Single line solution would be perfect :)

谢谢!

推荐答案

一种方法是:

var saveData = (function () {
var a = document.createElement("a");
// document.body.appendChild(a);
// a.style = "display: none";
return function (data, fileName) {
    var json = JSON.stringify(data),
        blob = new Blob([json], {type: "octet/stream"}),
        url = window.URL.createObjectURL(blob);
    a.href = url;
    a.download = fileName;
    a.click();
    window.URL.revokeObjectURL(url);
};
}());

var data = { x: 42, s: "hello, world", d: new Date() },
    fileName = "my-download.json";

saveData(data, fileName);

另一个是使用下载元素

var download = document.getElementById('download');
download.setAttribute('href', 'data:text/csv;charset=utf-8,' + encodeURIComponent(VALUE));
download.setAttribute('download', 'filename.csv');

但浏览器兼容性也有不同的其他方式.

but there are other ways too with difference in browser compatibility.

制作图书馆,而不是战争.FileSaver.js 在本身不支持的浏览器中实现了 saveAs() FileSaver 接口.

Make libraries, not the war. FileSaver.js implements the saveAs() FileSaver interface in browsers that do not natively support it.

如果您需要保存比 blob 的大小限制更大的非常大的文件,或者没有足够的 RAM,请查看更高级的 StreamSaver.js 可以通过新的流 API 的强大功能将数据异步直接保存到硬盘驱动器.这将支持进度、取消和知道何时完成写入.

If you need to save really large files bigger then the blob's size limitation or don't have enough RAM, then have a look at the more advanced StreamSaver.js that can save data directly to the hard drive asynchronously with the power of the new streams API. That will have support for progress, cancelation and knowing when it's done writing.

以下代码段允许您生成一个文件(带有任何扩展名)并在不联系任何服务器的情况下下载它:

The following snippet allow you to generate a file (with any extension) and download it without contact any server :

var content = "What's up , hello world";
// any kind of extension (.txt,.cpp,.cs,.bat)
var filename = "hello.txt";

var blob = new Blob([content], {
 type: "text/plain;charset=utf-8"
});

saveAs(blob, filename);

这篇关于Javascript:: 导出到文本文件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆