js导出table为Excel，支持较大数据量

最新推荐文章于 2025-03-12 14:31:08 发布

菜鸟-编程

最新推荐文章于 2025-03-12 14:31:08 发布

阅读量3.2k

点赞数 5

分类专栏： # js 文章标签： js js导出Excel

js 专栏收录该内容

6 篇文章

订阅专栏

该博客介绍了使用JS将表格导出为Excel文件的方法。通过获取表格内容，使用Blob处理数据，解决中文乱码问题，创建a标签并设置链接和文件名，最后触发单击事件实现导出。还提及了表格单元格不同格式的设置。

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

<body>
   <a href="javascript:exportFile()">导出</a>
   <table id="showTable" border="1" width="100%">
   <c:forEach begin="0" end="5000" var="i">
       <tr>
           <c:forEach begin="0" end="30" var="j">
               
               <td style="text-align:center; mso-number-format:'@';">${i }${j }</td>
           </c:forEach>
       </tr>
   </c:forEach>
   </table>


   <script type="text/javascript">
  /**
* 表格导出
* style="mso-number-format:'@';"
* 1）文本：'@'
   * 2）日期：'yyyy/mm/dd'
   * 3）数字：'#,##0.00'
   * 4）货币：'￥#,##0.00'
   * 5）百分比：'#0.00%'
*/
       function exportFile(){
           //获取表格
           var exportFileContent = document.getElementById("showTable").outerHTML;

           //设置格式为Excel，表格内容通过btoa转化为base64，此方法只在文件较小时使用(小于1M)
           //exportFileContent = window.btoa(unescape(encodeURIComponent(exportFileContent)));
           //var link = "data:"+MIMEType+";base64," + exportFileContent;

           //使用Blob
           var blob = new Blob([exportFileContent], {type: "text/plain;charset=utf-8"});
           //解决中文乱码问题
           blob = new Blob([String.fromCharCode(0xFEFF), blob], {type: blob.type});
           //设置链接
           var link = window.URL.createObjectURL(blob);

           var a = document.createElement("a");   //创建a标签
           a.download = "数据展示.xls";               //设置被下载的超链接目标（文件名）
           a.href = link;                           //设置a标签的链接
           document.body.appendChild(a);           //a标签添加到页面
           a.click();                               //设置a标签触发单击事件
           document.body.removeChild(a);           //移除a标签
       }
   </script>
</body>

页面

下载

下载后的Excel