前端导出excel

最新推荐文章于 2025-03-07 17:25:20 发布

转载最新推荐文章于 2025-03-07 17:25:20 发布 · 280 阅读

文章标签：

#js

js 专栏收录该内容

20 篇文章

订阅专栏

本文介绍了一种使用jQuery将数据导出为Excel文件的方法。通过定义数据集和表头，可以轻松地将JSON格式的数据转换成Excel表格，并提供下载链接。此方法适用于需要快速实现数据导出功能的Web应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

$('.expory_one').click(function() {
                            //data 需要导出的数据
                var data = [{userName:'lily',age:28,job:"teacher",city:"上海"},
                            {userName:'lucy',age:19,job:"doctor",city:"深圳"}];  
                if(data == '')  
                    return; 
                //excel 表格输出顺序及标题
                var title=[{userName:'姓名'},{job:'职业'},{age:'年龄'},{city:'城市'}]; 
                toExcel("Report", data, title);
        })

//FileName 生成的Excel文件名称
        function toExcel(FileName, JSONData, ShowLabel) {  
            //先转化json  
            var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : JSONData;  
              
            var excel = '<table>';      
              
            //设置表头  
            var row = "<tr align='left'>";//设置Excel的左居中
            for (var i = 0, l = ShowLabel.length; i < l; i++) {  
                for (var key in ShowLabel[i]) {
                    row += "<td>" + ShowLabel[i][key] + '</td>';  
                }
            }  
              
              
            //换行  
            excel += row + "</tr>";  
              
            //设置数据  
            for (var i = 0; i < arrData.length; i++) {  
                var rowData = "<tr align='left'>"; 

                for (var y = 0; y < ShowLabel.length; y++) {
                    for(var k in ShowLabel[y]){
                        if (ShowLabel[y].hasOwnProperty(k)) {
                             rowData += "<td style='vnd.ms-excel.numberformat:@'>" + (arrData[i][k]===null? "" : arrData[i][k]) + "</td>";
　　　　　　　　　　　　　　　　　 //vnd.ms-excel.numberformat:@ 输出为文本
                        }
                    }
                }

                excel += rowData + "</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);  
        }  
    }

转自：https://www.cnblogs.com/amy2017/archive/2017/11/27/7878810.html