JavaScript JSON导出Excel文件

JSON导出Excel文件[前端]

使用纯JSON格式或者Object对象导出为.xls格式文件，支持中文。具体函数为
function JSONToExcelConvertor(JSONData, FileName,title,filter)

JSONData[必填]：传入需要转换的数据（json或者object）
FileName：导出Excel文件名（不填为undefined.xls）
title[数组]：可以自定义标题（与json标题名称顺序一致，若需要过滤不填则可）
filter[数组]：过滤json中的相关行

1 HTML（测试）

<html>  
<head>  
    <meta http-equiv="content-type" content="text/html; charset=utf-8">  
    <script type="text/javascript" src="js/jquery-3.3.1.min.js" ></script>
    <script type="text/javascript" src="js/JSONToExcelConvertor.js" ></script>

    <script type="text/javascript">  
        $(document).ready(function(){  
            $('#wwo').click(function(){  
                //测试的json数据
                var data3=[{"id":10000,"username":"user-0","sex":"女","city":"城市-0","sign":"签名-0","experience":255,"logins":24},
                {"id":10001,"username":"user-1","sex":"男","city":"城市-1","sign":"签名-1","experience":884,"logins":58} ,
                {"id":10002,"username":"user-2","sex":"女","city":"城市-2","sign":"签名-2","experience":650,"logins":77}]

                //自定义标题栏
                var title=['用户名','性别','城市','签名','经验']  
                //自定义过滤栏（不需要导出的行）
                var filter=['id','logins']               

                //原始导出
                JSONToExcelConvertor(data3,"report"); 
                //自定义导出
                //JSONToExcelConvertor(data3,"report",title,filter);
            });  
        });     
    </script>  
</head>  
<body>  
    <input type="button" id="wwo" value="导出" />  
</body>  
</html>

2 JSONToExcelConvertor.js

function JSONToExcelConvertor(JSONData, FileName,title,filter) {  
    if(!JSONData)
        return;
    //转化json为object
    var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : JSONData;  

    var excel = "<table>";      

    //设置表头  
    var row = "<tr>";  

    if(title)
    {
        //使用标题项
        for (var i in title) {  
            row += "<th align='center'>" + title[i] + '</th>';
        }  

    }
    else{
        //不使用标题项
        for (var i in arrData[0]) {  
            row += "<th align='center'>" + i + '</th>';
        } 
     }

        excel += row + "</tr>";  

    //设置数据  
    for (var i = 0; i < arrData.length; i++) {  
        var row = "<tr>";  

        for (var index in arrData[i]) {
            //判断是否有过滤行
            if(filter)
            {
                if(filter.indexOf(index)==-1)
                {
                     var value = arrData[i][index] == null ? "" : arrData[i][index];  
                     row += '<td>' + value + '</td>'; 
                } 
            }
            else
            {
                 var value = arrData[i][index] == null ? "" : arrData[i][index];  
                 row += "<td align='center'>" + value + "</td>"; 
            }    
        }  

        excel += row + "</tr>";  
            }  

            excel += "</table>";  

            var excelFile = "<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:x='urn:schemas-microsoft-com:office:excel' xmlns='http://www.w3.org/TR/REC-html40'>";  
    excelFile += '<meta http-equiv="content-type" content="application/vnd.ms-excel; charset=UTF-8">';  
    excelFile += '<meta http-equiv="content-type" content="application/vnd.ms-excel';  
    excelFile += '; charset=UTF-8">';  
    excelFile += "<head>";  
    excelFile += "<!--[if gte mso 9]>";  
    excelFile += "<xml>";  
    excelFile += "<x:ExcelWorkbook>";  
    excelFile += "<x:ExcelWorksheets>";  
    excelFile += "<x:ExcelWorksheet>";  
    excelFile += "<x:Name>";  
    excelFile += "{worksheet}";  
    excelFile += "</x:Name>";  
    excelFile += "<x:WorksheetOptions>";  
    excelFile += "<x:DisplayGridlines/>";  
    excelFile += "</x:WorksheetOptions>";  
    excelFile += "</x:ExcelWorksheet>";  
    excelFile += "</x:ExcelWorksheets>";  
    excelFile += "</x:ExcelWorkbook>";  
    excelFile += "</xml>";  
    excelFile += "<![endif]-->";  
    excelFile += "</head>";  
    excelFile += "<body>";  
    excelFile += excel;  
    excelFile += "</body>";  
    excelFile += "</html>";  


    var uri = 'data:application/vnd.ms-excel;charset=utf-8,' + encodeURIComponent(excelFile);  

    var link = document.createElement("a");      
    link.href = uri;  

    link.style = "visibility:hidden";  
    link.download = FileName + ".xls";  

    document.body.appendChild(link);  
    link.click();  
    document.body.removeChild(link);  
}

3 结果

原始导出　结果：
自定义导出　结果：

参考连接

版权声明：本文来源CSDN，感谢博主原创文章，遵循 CC 4.0 by-sa 版权协议，转载请附上原文出处链接和本声明。
原文链接：https://blog.csdn.net/qq_34623560/article/details/79928248
站方申明：本站部分内容来自社区用户分享，若涉及侵权，请联系站方删除。

发表于 2021-06-13 12:28:36
阅读 ( 811 )
分类：前端

JavaScript JSON导出Excel文件

JSON导出Excel文件[前端]

1 HTML（测试）

2 JSONToExcelConvertor.js

3 结果

参考连接

你可能感兴趣的文章

精选的优质文章

0 条评论

官方社群

GO教程

推荐文章

猜你喜欢

随便看看