如何用SheetJS将Excel指定区域转换为HTML表格？

核心结论 #

SheetJS的XLSX.utils.sheet_to_html目前没有直接指定转换区域的配置项，最稳妥的方式是先把目标区域提取到新工作表，再调用转换函数，这样能完整保留合并单元格等格式。

最优实现步骤 #

1. 解析目标区域的行列范围
   用XLSX.utils.decode_range直接解析类似E6:G10的区域字符串，得到起始和结束的行列索引（注意SheetJS中行列索引从0开始，比如E列对应索引4，第6行对应索引5）：

   const range = XLSX.utils.decode_range('E6:G10');
   // range.s.c = 4 (E列), range.s.r = 5 (第6行)
   // range.e.c = 6 (G列), range.e.r = 9 (第10行)
   

2. 创建新工作表并复制目标区域内容
   初始化空工作表，遍历目标区域的每个单元格，复制原工作表的单元格数据，同时处理合并单元格：

   // 原工作表对象为ws
   const newWs = XLSX.utils.aoa_to_sheet([]);
   
   // 复制单元格数据
   for (let r = range.s.r; r <= range.e.r; r++) {
     for (let c = range.s.c; c <= range.e.c; c++) {
       const cellAddr = XLSX.utils.encode_cell({r, c});
       if (ws[cellAddr]) {
         // 转换为新工作表的单元格位置（从A1开始偏移）
         const newR = r - range.s.r;
         const newC = c - range.s.c;
         const newCellAddr = XLSX.utils.encode_cell({r: newR, c: newC});
         newWs[newCellAddr] = {...ws[cellAddr]};
       }
     }
   }
   
   // 处理合并单元格
   if (ws['!merges']) {
     newWs['!merges'] = ws['!merges']
       // 筛选出完全落在目标区域内的合并单元格
       .filter(merge => 
         merge.s.r >= range.s.r && merge.e.r <= range.e.r &&
         merge.s.c >= range.s.c && merge.e.c <= range.e.c
       )
       // 转换合并单元格的行列索引到新工作表
       .map(merge => ({
         s: {r: merge.s.r - range.s.r, c: merge.s.c - range.s.c},
         e: {r: merge.e.r - range.s.r, c: merge.e.c - range.s.c}
       }));
   }
   
   // 设置新工作表的有效范围，避免空行空列
   newWs['!ref'] = XLSX.utils.encode_range({
     s: {r: 0, c: 0},
     e: {r: range.e.r - range.s.r, c: range.e.c - range.s.c}
   });
   

3. 生成HTML表格
   用新工作表调用sheet_to_html即可得到目标区域的HTML：

   const html = XLSX.utils.sheet_to_html(newWs);
   

补充说明 #

• 这种方法能完整保留原区域的合并单元格、单元格样式（若原工作表有样式信息）等格式；
• 若仅需纯数据表格，可先用XLSX.utils.sheet_to_json指定range参数转成JSON再自行生成HTML，但会丢失合并单元格格式，不适合需要保留格式的场景。

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