如何使用jQuery DataTables将多表结果导入单个Excel工作表？

当然可以做到，核心思路是收集多个DataTables的数据并合并，再通过Excel导出工具生成包含所有内容的单个工作表，下面是具体实现方案：

实现步骤 #

• 提取每个表格的表头和行数据：分别获取每个DataTables实例的表头文本和所有行的数据
• 合并数据结构：将多个表格的数据按顺序拼接，可添加空行或标题作为分隔（和你截图里的效果匹配）
• 自定义导出逻辑：利用XLSX库（DataTables Excel导出的底层依赖）生成包含合并后数据的Excel文件

代码示例 #

假设页面上有两个DataTables表格，ID分别为table1和table2，实现一键导出的代码如下：

<!-- 确保引入必要依赖 -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.datatables.net/1.13.4/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/buttons/2.3.6/js/dataTables.buttons.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>

<table id="table1" class="display">
  <!-- 表格1内容 -->
</table>
<table id="table2" class="display">
  <!-- 表格2内容 -->
</table>

<button id="exportAllTables">导出所有表格到Excel</button>

<script>
// 初始化两个表格
$('#table1').DataTable();
$('#table2').DataTable();

// 绑定导出按钮事件
$('#exportAllTables').click(function() {
  // 提取表格1的表头和数据
  const dt1 = $('#table1').DataTable();
  const table1Header = dt1.columns().header().map(th => $(th).text()).toArray();
  const table1Rows = dt1.rows().data().toArray();
  const table1Data = [table1Header, ...table1Rows, []]; // 末尾加空行分隔

  // 提取表格2的表头和数据
  const dt2 = $('#table2').DataTable();
  const table2Header = dt2.columns().header().map(th => $(th).text()).toArray();
  const table2Rows = dt2.rows().data().toArray();
  const table2Data = [table2Header, ...table2Rows];

  // 合并所有数据
  const mergedData = [...table1Data, ...table2Data];

  // 生成Excel文件
  const worksheet = XLSX.utils.aoa_to_sheet(mergedData);
  const workbook = XLSX.utils.book_new();
  XLSX.utils.book_append_sheet(workbook, worksheet, '多表汇总');

  // 下载文件
  XLSX.writeFile(workbook, '多表数据导出.xlsx');
});
</script>

注意事项 #

• 如果表格包含自定义渲染内容（比如按钮、格式化文本），需要调整rows().data()的提取逻辑，确保拿到的是实际需要导出的文本值
• 可以根据需求修改分隔方式，比如添加自定义标题行、调整空行数量
• 确保所有依赖库版本兼容，避免出现加载错误

内容的提问来源于stack exchange，提问作者hewszz