简介
在前端开发中，有时我们需要让用户将页面上的内容（如报告、表格或文章）导出为 Word 文档。通过原生 JavaScript 和简单的 MIME 类型设置，即可实现 HTML 内容一键导出为 .doc 文件。
实现原理
利用 data:application/msword 协议，将 HTML 字符串转换为 Blob 并触发下载。虽然生成的是 .doc 格式，但本质上仍是 HTML 内容，兼容大多数 Word 软件。
示例代码
<button onclick="exportToWord()">导出为Word文档</button>
<script>
function exportToWord() {
const html = `<html xmlns:o='urn:schemas-microsoft-com:office:office'
xmlns:w='urn:schemas-microsoft-com:office:word'
xmlns='http://www.w3.org/TR/REC-html40'>
<head><meta charset='utf-8'></head>
<body>
<h1>这是从HTML导出的Word文档</h1>
<p>当前时间：${new Date().toLocaleString()}</p>
</body></html>`;
const blob = new Blob(['\ufeff', html], {
type: 'application/msword'
});
const url = URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = url;
link.download = '导出文档.doc';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
URL.revokeObjectURL(url);
}
</script>注意事项
- 该方法生成的是伪 .doc 文件，实际内容为 HTML，适用于简单排版。
- 复杂样式（如 CSS3、Flex、Grid）可能无法在 Word 中正确显示。
- 如需生成标准 .docx 文件，建议使用后端库（如 python-docx、docxtemplater 等）。