前端html-docx实现html转word，并导出文件，文字+图片
要在前端使用HTML转换为Word并导出文件（包含文字和图片），可以使用html-docx-js库。以下是一个简单的示例代码：
- 首先，确保在项目中安装了
html-docx-js：
npm install html-docx-js- 然后，使用以下HTML和JavaScript代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>HTML to Word Example</title>
</head>
<body>
<div id="content">
<h1>Hello World</h1>
<p>This is a paragraph with some text and an image.</p>
<img src="path_to_your_image.jpg" alt="Sample Image" />
</div>
<button id="export">Export to Word</button>
<script src="html-docx.js"></script>
<script src="script.js"></script>
</body>
</html>- JavaScript代码 (
script.js):
document.getElementById('export').addEventListener('click', function() {
let content = document.getElementById('content').innerHTML;
let converted = htmlDocx.asBlob(content);
saveAs(converted, 'document.docx');
});
// saveAs function is provided by file-saver library确保在你的项目中也安装了file-saver，这是用来保存生成的Word文档的：
npm install file-saverhtml-docx-js库依赖于html-docx-js模块来转换HTML到Word文档格式。saveAs函数来自file-saver库，用于将生成的Word文档保存为本地文件。
注意：上述代码示例假设你有一个图片资源path_to_your_image.jpg，并且已经安装了html-docx-js和file-saver库。实际使用时，请替换为你的实际图片路径和进行必要的库安装。
评论已关闭