JS_js数据导出excel文件

Myth丶恋晨 2022-10-06 05:49 231阅读 0赞

<html>
    	<head>
    		<div>以Table格式导为xls文件
    			<button onclick='TableToExcel()'>导出</button></div>
    		<div>导出CSV文件
    			<button onclick='toCSV()'>导出</button></div>
    		<div>大量数据导出CSV
    			<button onclick='toLargerCSV()'>导出</button></div>
    	</head>
    	<body>
    		<script> //以Table格式导为xls文件 function TableToExcel() { //要导出的json数据 var jsonData = [{ name: '001', id: '621699190001011231' }, { name: '002', id: '52069919000101547X' }, { name: '003', id: '423699190103015469' }, { name: '004', id: '341655190105011749' } ] //导出前要将json转成table格式 //列标题 var str = '<tr><td>name</td><td>id</td></tr>'; //具体数值 遍历 for (let i = 0; i < jsonData.length; i++) { str += '<tr>'; for (let item in jsonData[i]) { var cellvalue = jsonData[i][item]; //不让表格显示科学计数法或者其他格式 //方法1 tr里面加 style="mso-number-format:'\@';" 方法2 是改为 = 'XXXX'格式 //如果纯数字且超过15位 /*var reg = /^[0-9]+.?[0-9]*$/; if ((cellvalue.length>15) && (reg.test(cellvalue))){ //cellvalue = '="' + cellvalue + '"'; }*/ //此处用`取代'，具体用法搜索模板字符串 ES6特性 str += `<td style="mso-number-format:'\@';">${ cellvalue}</td>`; // str+=`<td>${cellvalue}</td>`; } str += '</tr>'; } var worksheet = '导出结果' var uri = 'data:application/vnd.ms-excel;base64,'; //下载的表格模板数据 var template = `<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"> <head> </head><body><table>${ str}</table></body></html>`; //下载模板 function base64(s) { return window.btoa(unescape(encodeURIComponent(s))) } window.location.href = uri + base64(template); } function toCSV() { //要导出的json数据 var jsonData = [{ name: '001', id: '621699190001011231' }, { name: '002', id: '52069919000101547X' }, { name: '003', id: '423699190103015469' }, { name: '004', id: '341655190105011749' } ] //导出前要将json转成table格式 //列标题 var str = 'name,id\n'; //具体数值 遍历 for (let i = 0; i < jsonData.length; i++) { for (let item in jsonData[i]) { //增加\t为了不让表格显示科学计数法或者其他格式 //此处用`取代'，具体用法搜索模板字符串 ES6特性 str += `${ jsonData[i][item] + '\t,'}`; } str += '\n'; } let uri = 'data:text/csv;charset=utf-8,\ufeff' + encodeURIComponent(str); var link = document.createElement("a"); link.href = uri; link.download = "导出.csv"; document.body.appendChild(link); link.click(); document.body.removeChild(link); } //支持大批量数据导出，目前测试15万行 30列通过，导出时间约为6秒 function toLargerCSV() { //CSV格式可以自己设定，适用MySQL导入或者excel打开。 //由于Excel单元格对于数字只支持15位，且首位为0会舍弃 建议用 =“数值” var str = '行号,内容,题目,标题\n'; for (let i = 0; i < 100000; i++) { str += i.toString() + ',1234567890123456789\t,张三李四王五赵六,bbbb,\n' } var blob = new Blob([str], { type: "text/plain;charset=utf-8" }); //解决中文乱码问题 blob = new Blob([String.fromCharCode(0xFEFF), blob], { type: blob.type }); object_url = window.URL.createObjectURL(blob); var link = document.createElement("a"); link.href = object_url; link.download = "导出.csv"; document.body.appendChild(link); link.click(); document.body.removeChild(link); } </script>
    	</body>
    </html>