标签:font span input hone table sch let ide 数据
<html> <meta charset="UTF-8"> <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> <head> <input type="text" name="" id="content" value="" /> <p style="font-size: 20px;color: red;">使用table标签方式将json导出xls文件</p> <button onclick=‘aa()‘>导出</button> </head> <body> <script> function aa(){ var content = $(‘#content‘).val() debugger console.log(content); } function tableToExcel() { //要导出的json数据 const jsonData = [{ name: ‘路人甲‘, phone: ‘123456‘, email: ‘123@123456.com‘ }, { name: ‘炮灰乙‘, phone: ‘123456‘, email: ‘123@123456.com‘ }, { name: ‘土匪丙‘, phone: ‘123456‘, email: ‘123@123456.com‘ }, { name: ‘流氓丁‘, phone: ‘123456‘, email: ‘123@123456.com‘ }, ] //列标题 let str = ‘<tr><td>姓名</td><td>电话</td><td>邮箱</td></tr>‘; //循环遍历,每行加入tr标签,每个单元格加td标签 for(let i = 0; i < jsonData.length; i++) { str += ‘<tr>‘; for(let item in jsonData[i]) { //增加\t为了不让表格显示科学计数法或者其他格式 str += `<td>${ jsonData[i][item] + ‘\t‘}</td>`; } str += ‘</tr>‘; } //Worksheet名 let worksheet = ‘Sheet1‘ let uri = ‘data:application/vnd.ms-excel;base64,‘; //下载的表格模板数据 let 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><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet> <x:Name>${worksheet}</x:Name> <x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet> </x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--> </head><body><table>${str}</table></body></html>`; //下载模板 window.location.href = uri + base64(template) } //输出base64编码 function base64(s) { return window.btoa(unescape(encodeURIComponent(s))) } </script> </body> </html>
标签:font span input hone table sch let ide 数据
原文地址:https://www.cnblogs.com/wush-1215/p/12591006.html