以下是介绍两个常用的
前端 插件来实现
HTML表格Excel导出的方法:
1. TableExport.js
插件TableExport.js是一个轻量级的jQuery
插件,可以将
HTML表格导出为Excel、CSV、TXT和
PDF格式。使用该
插件需要引入jQuery库和TableExport.js文件。
html<!-- 引入jQuery库 --><script src=https://blog.csdn.net/Y/article/details/"https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script><!-- 引入TableExport.js文件 --><script src=https://blog.csdn.net/Y/article/details/"https://cdn.bootcss.com/TableExport/5.2.0/js/tableexport.min.js"></script>
然后在需要导出的表格上添加`data-tableexport`属性,并设置导出格式和文件名:
html<table id="myTable"><thead><tr><th>Name</th><th>Age</th><th>Gender</th></tr></thead><tbody><tr><td>John</td><td>25</td><td>Male</td></tr><tr><td>Jane</td><td>30</td><td>Female</td></tr></tbody></table><button onclick="exportTable()">Export Table</button><script>function exportTable() {$('#myTable').tableExport({type: 'xlsx', // 导出Excel格式fileName: 'myTable', // 导出文件名});}</script>
2. SheetJS.js
插件SheetJS.js是一个
纯JavaScript库,可以将
HTML表格导出为Excel、CSV和JSON格式。使用该
插件需要引入SheetJS.js文件。
html<!-- 引入SheetJS.js文件 --><script src=https://blog.csdn.net/Y/article/details/"https://cdn.bootcss.com/xlsx/0.16.8/xlsx.full.min.js"></script>
然后在需要导出的表格上添加`id`属性:
html<table id="myTable"><thead><tr><th>Name</th><th>Age</th><th>Gender</th></tr></thead><tbody><tr><td>John</td><td>25</td><td>Male</td></tr><tr><td>Jane</td><td>30</td><td>Female</td></tr></tbody></table><button onclick="exportTable()">Export Table</button><script>function exportTable() {/* 获取表格数据 */var wb = XLSX.utils.table_to_book(document.getElementById('myTable'), {sheet:"Sheet1"});/* 导出Excel文件 */XLSX.writeFile(wb, 'myTable.xlsx');}</script>
版权声明:
本文来源网络,所有图片文章版权属于原作者,如有侵权,联系删除。
本文网址:https://www.mushiming.com/mjsbk/4354.html