使用js将html的表格导出到excel-2.0(支持大批量导出)

本文链接：https://blog.csdn.net/qq_33188431/article/details/129426557

文章介绍了如何使用js将包括分页数据的HTML表格快速导出到Excel，基于xlsx.js和FileSaver库。虽然存在效率和内存占用问题，但提供了更灵活的表头配置和数据过滤功能，适用于需要导出大量数据的场景。

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

之前写过一篇可以把html页面的表格快速导出到excel，但是仅支持当前页面的table，一旦碰到分页数据，就会显得很鸡肋，下面介绍一种新的快速导出方式。
导出1.0请参考：

使用js将html的表格导出到excel-1.0

示例

1. 页面

在这里插入图片描述

2.导出结果

在这里插入图片描述

3.代码

需要导出的字段一定要包含在表头参数里面，具体可参考原创作者文档，原作者

原文档：lay-excel

原作者对该项目描述如下：

导出数据速度由运行的电脑性能决定，插件基于 xlsx.js 和 FileSaver，只是做了一个简单的封装。
经本人工作电脑测试，前端导出纯数据 9列10w 的数据量需要 7秒左右的时间，30W数据占用1.8G，耗时24秒，普通电脑最多能导出50w数据，耗时45秒，文件大小173M，提示内存超限

电脑配置及系统状况：
CPU(占用24%)：Intel(R) Core(TM) i5-6300U CPU @ 2.40GHz
内存(占用73%)： 8.0 GB DDR3,Speed: 1600 MHz
数据量测试：
在决定使用本插件前，请根据业务实际需求量修改『导出数据测试样例』或者『导入样例』进行浏览器压力测试，满足需求再使用本插件。
PS：效率和内存占用的问题我目前也没有好的解决方案，因为文件生成逻辑在XLSX.JS那边

3.1引用js

<script src="./js/excel.js"></script>

3.2导出方法

  testDownload() {
                let _this = this;
                let parameter = _this.formInline;
                parameter.pageSize = -1;
                $.get(_address + '/schedule/getPageScheduleLog', parameter, function (res) {
                    let resultVal = res.data;
                    //字段转义（个人业务需要）
                    let index = 1;
                    resultVal.forEach(val => {
                        val.index = index;
                        if (val.status == 1) {
                            val.status = '成功'
                            val.times = (val.times / 1000);
                        } else {
                            val.status = '失败'
                        }
                        index++;
                    });
                    //添加表头
                    let val = {
                        index: '序号',
                        id: 'ID',
                        jobId: '任务ID',
                        jobName: '任务名称',
                        params: '参数',
                        status: '状态',
                        beanName: '调度类',
                        methodName: '调用方法',
                        createTime: '创建时间',
                        times: '耗时(s)'
                    }
                    resultVal.unshift(val);
                    //导出字段过滤，只导出如下字段
                    resultVal = LAY_EXCEL.filterExportData(resultVal, ['index', 'jobName', 'status', 'createTime', 'times']);
                    LAY_EXCEL.exportExcel(resultVal, '调度任务日志.xlsx', 'xlsx');
                });
            }