js导出excel，csv

ゝ一世哀愁。 2022-05-25 11:52 141阅读 0赞

导出页面表格里的数据为excel,IE浏览器要用到插件ActiveXObject

非IE浏览器下可以通过设置a标签的形式，将要导出的数据追加到a标签的href属性上，从而实现下载

js:

var idTmr;
    function  getExplorer() { //查询浏览器类型
        var explorer = window.navigator.userAgent ;
        //ie  
        if (explorer.indexOf("MSIE") >= 0) {
            return 'ie';
        }
        //firefox  
        else if (explorer.indexOf("Firefox") >= 0) {
            return 'Firefox';
        }
        //Chrome  
        else if(explorer.indexOf("Chrome") >= 0){
            return 'Chrome';
        }
        //Opera  
        else if(explorer.indexOf("Opera") >= 0){
            return 'Opera';
        }
        //Safari  
        else if(explorer.indexOf("Safari") >= 0){
            return 'Safari';
        }
    }
    function method5(tableid) {
        if(getExplorer()=='ie') //IE浏览器的处理方式
        {
            var curTbl = document.getElementById(tableid);
            var oXL = new ActiveXObject("Excel.Application");
            var oWB = oXL.Workbooks.Add();
            var xlsheet = oWB.Worksheets(1);
            var sel = document.body.createTextRange();
            sel.moveToElementText(curTbl);
            sel.select();
            sel.execCommand("Copy");
            xlsheet.Paste();
            oXL.Visible = true;
    
            try {
                var fname = oXL.Application.GetSaveAsFilename("Excel.xls", "Excel Spreadsheets (*.xls), *.xls");
            } catch (e) {
                print("Nested catch caught " + e);
            } finally {
                oWB.SaveAs(fname);
                oWB.Close(savechanges = false);
                oXL.Quit();
                oXL = null;
                idTmr = window.setInterval("Cleanup();", 1);
            }
    
        }
        else //非IE浏览器
        {
            tableToExcel(tableid)
        }
    }
    function Cleanup() {
        window.clearInterval(idTmr);
        CollectGarbage();
    }

//跟通过a标签实现的方式原理一样
    var tableToExcel = (function() {
        var uri = 'data:application/vnd.ms-excel;base64,',
                template = '<html><head><meta charset="UTF-8"></head><body><table>{table}</table></body></html>',
                base64 = function(s) { return window.btoa(unescape(encodeURIComponent(s))) },
                format = function(s, c) {
                    return s.replace(/{(\w+)}/g,
                            function(m, p) { return c[p]; }) }
        return function(table, name) {
            if (!table.nodeType) table = document.getElementById(table)
            var ctx = {worksheet: name || 'Worksheet', table: table.innerHTML}
            window.location.href = uri + base64(format(template, ctx))
        }
    })()

//通过a标签
    <a id="test" href="javascript:;">导出</a>

document.getElementById("test").onclick = function() {
        var str = "列1,列2,列3\n123,345,456"
        //加\ufeff防止中文乱码，或者把编码格式改为gb2312
        var uri = 'data:text/csv;charset=utf-8,\ufeff' + encodeURIComponent(str);
        var downloadLink = document.createElement("a");
        downloadLink.href = uri;
        downloadLink.download = "export.csv";
        document.body.appendChild(downloadLink);
        downloadLink.click();
        document.body.removeChild(downloadLink);

也可以通过filesave.js插件实现 前提是先引入[filesave.js][] （https://github.com/eligrey/FileSaver.js/）

[filesave.js]: https://github.com/eligrey/FileSaver.js/