导出HTML表格需使用规范的table结构，优先采用SheetJS生成真实.xlsx文件，服务端导出最可靠但须正确设置响应头。
导出 HTML 表格时，table 结构必须规范
浏览器原生不支持直接把任意 <div> 布局当表格导出，只有语义正确的 <table>（含 <thead>、<tbody>、必要时 <th>/<td>）才能被 Excel 正确识别列宽、合并单元格和样式。常见错误是用 CSS Grid 或 Flex 模拟表格——这类结构导出后会变成单列乱码文本。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 确保
<table>标签存在，且嵌套层级干净：不要在<tr>里塞<div>，避免<table>套<table> - 跨列/跨行用
colspan和rowspan，别靠 CSSgrid-column模拟 - 如果用了 Vue/React 渲染表格，确认最终 DOM 是标准
<table>，不是运行时生成的虚拟节点
用 data:application/vnd.ms-excel 导出最轻量，但有兼容性陷阱
这是最常用的方式：拼接 HTML 字符串，用 data: URL 触发下载。但它在新版 Chrome 和 Edge 中会被拦截（因为 MIME 类型过时），且 Excel 打开时总弹“文件格式与扩展名不匹配”警告。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 优先改用
data:application/vnd.openxmlformats-officedocument.spreadsheetml.sheet（对应 .xlsx），但需注意：纯前端无法生成合规的 .xlsx 二进制流，所以实际仍是伪装成 .xlsx 的 HTML 文件（Excel 能打开，但本质是 HTML） - 文件名后缀必须为
.xls或.xlsx，否则 Safari 不触发下载 - 中文表头要加
<meta charset="UTF-8">到 HTML 字符串头部，否则 Excel 显示乱码
SheetJS（xlsx.js）是目前最稳的方案，但要注意导出模式
它能真正生成二进制 .xlsx，兼容所有现代浏览器，且支持公式、样式、多 sheet。但默认 XLSX.utils.table_to_sheet() 只读取 <table> 文本内容，丢弃所有 HTML 样式和属性。
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 用
XLSX.utils.table_to_sheet(document.querySelector('table'))提取数据，再用XLSX.writeFile(wb, 'data.xlsx')下载 - 若需保留颜色、字体或列宽，必须手动设置
cell.v（值）、cell.s（样式对象），不能依赖自动解析 - 大数据量（>5000 行）时，禁用
cellFormula选项，否则性能骤降
服务端导出更可靠，但得处理 Content-Disposition 头
前端传 JSON 数据给后端，由 Node.js/Python/Java 生成真实 Excel 文件返回，彻底避开浏览器限制。但常因响应头缺失导致文件名乱码或下载失败。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 响应头必须包含：
Content-Type: application/vnd.openxmlformats-officedocument.spreadsheetml.sheet和Content-Disposition: attachment; filename*=UTF-8''%E6%95%B0%E6%8D%AE.xlsx（注意filename*=后是 UTF-8 编码的文件名） - 不要用
filename="数据.xlsx"，中文会变%E6%95%B0%E6%8D%AE.xlsx或直接截断 - 前端用
fetch+response.blob()+URL.createObjectURL()触发下载，避免window.location导致页面跳转
真正麻烦的不是怎么导出，而是表格里混了按钮、图标、隐藏列——这些元素不会被 Excel 识别，但可能让 table_to_sheet 解析错行。动手前先清理 DOM，比调参数更重要。
