如何用JavaScript将textarea内容导出为DOCX文件？

你的代码核心问题是直接将纯字符串传入doc.addParagraph()，docx库的addParagraph()方法需要接收Paragraph对象而非原始字符串。以下是修正后的可运行方案：

完整实现代码 #

<!DOCTYPE html>
<html>
<head>
    <title>导出DOCX</title>
    <!-- 引入docx库的CDN版本，无需npm安装 -->
    <script src="https://unpkg.com/docx@8.5.0/build/index.js"></script>
</head>
<body>
    <textarea id="content" rows="10" cols="50">在这里输入内容...</textarea>
    <button onclick="saveToDocx()">导出为DOCX</button>

    <script>
        function saveToDocx() {
            const { Document, Packer, Paragraph, TextRun } = window.docx;
            
            // 获取textarea内容
            const content = document.getElementById("content").value;
            
            // 创建文档实例
            const doc = new Document();
            
            // 处理textarea的换行：将\n分割为多个段落，保留原格式
            const lines = content.split('\n');
            lines.forEach(line => {
                const paragraph = new Paragraph({
                    children: [new TextRun(line)]
                });
                doc.addParagraph(paragraph);
            });
            
            // 生成Blob并触发下载
            Packer.toBlob(doc).then(blob => {
                const link = document.createElement("a");
                link.href = URL.createObjectURL(blob);
                link.download = "output.docx";
                link.click();
                // 释放临时URL，避免内存泄漏
                URL.revokeObjectURL(link.href);
            });
        }
    </script>
</body>
</html>

关键说明 #

• 库的引入：浏览器端直接用CDN引入docx库，绕开了模块import的配置门槛；
• 段落创建：必须通过new Paragraph()创建段落对象，用TextRun包裹文本内容，这是docx库的规范要求；
• 换行处理：将textarea中的\n分割为独立段落，确保导出的DOCX保留原文本的换行格式；
• 内存优化：下载完成后调用URL.revokeObjectURL()释放临时资源，避免浏览器内存占用过高。

如果需要添加格式（比如加粗、字号调整），可以给TextRun配置属性，示例：

new TextRun({
    text: "这是加粗的大字号文本",
    bold: true,
    size: 24 // 单位为1/2磅，24对应12号字
})

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