mammothJs解析docx文件

今天接到一个任务，任务要求是把一个静态页面的表格内的每个单元格内容根据给出的Word文档内表格的内容一一替换；

what？？？

这要是一个个复制、粘贴，不得直接弄到半夜回家吃宵夜啊。。。

于是乎就想着有没有啥封装好的可以直接用的，一通度娘，找到了mammothJs；

相关CDN地址：https://cdn.bootcss.com/mammoth/1.4.8/mammoth.browser.js

直接上代码：

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><button id="copy" style="display: none;margin-bottom: 20px;">复制一下产出来的html</button><div class="container"><input id="document" type="file" /><div id="output"></div></div><script src="https://cdn.bootcss.com/mammoth/1.4.8/mammoth.browser.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/1.7.1/clipboard.min.js"></script><script type="text/javascript"src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.slim.min.js"></script><script>// mammothJs只能读取docx文件~所以打开word后先另存为docx（文件类型选择Word文档选项）格式$("#document").on("change", readFileInputEventAsArrayBuffer);function showResult(result) {console.log(result);let html = result.value;// 将解析出来的dom元素的展示替换成自己想要的样子let newHTML = html.replace(/<table>/g, '<table style="border-collapse: collapse;">').replace(/<tr>/g, '<tr style="border: 1px solid rgb(204, 204, 204);color:#555555;">').replace(/<td>/g, '<td style="border: 1px solid rgb(204, 204, 204); padding: 8px 15px;">').replace(/<p>|<\/p>/g, '');// 将解析出来的html展示在页面上$("#output").html(newHTML);// 使用clipboardJs复制table下的内容，也就是我要替换的每个单元格里的内容；// 这句就是我把table的内容赋值到data-clipboard-text属性，这样的话点击“复制一下产出来的html”按钮，就可以把想要的复制的内容复制下来；那么后面我可以直接到页面上去粘贴就可以了$('#copy').attr('data-clipboard-text', $('table').html()).show();}function readFileInputEventAsArrayBuffer(event) {var file = event.target.files[0];var reader = new FileReader();reader.onload = function (loadEvent) {var arrayBuffer = loadEvent.target.result; // arrayBuffer     // mammothJsmammoth.convertToHtml({ arrayBuffer: arrayBuffer }).then(res => showResult(res));};reader.readAsArrayBuffer(file);}// clipboardJs复制部分const clipboard = new Clipboard('#copy');clipboard.on('success', function (e) {alert('复制成功');});clipboard.on('error', function (e) {alert('复制失败');});</script>
</body></html>

由于不想到浏览器里复制出需要替换的dom，所以使用clipboardJs直接复制出来。

这样整体就像一个生产零件的机器，把word上传解析后，直接产出需要的代码，然后把新零件换上，老零件换下~

mammothJs解析docx文件相关推荐

python table_用python解析word文件（二）：table
(二)表格篇(table)(本篇) 选你所需即可.下面开始正文. 上一篇我们讲了用python-docx解析docx文件中的段落,也就是paragraph,不过细心的同学可能发现了,只有自然段是可以用 ...
JAVA Apache POI解析docx格式的word文件并提取带样式文本
关于JAVA Apache POI读取word文档,网上资料很多,但是大多数还是仅仅提取文档中的纯文本,好一点的,也就提取所有图片,但是,word文档本身是具有样式的,这样简单粗暴的提取就会丢失字体. ...
Java Docx文件简介和解析
Docx简介以Microsoft Office的doc/docx 为主要处理对象 Word2003和之前都是doc,文档格式不公开 Word2007和之后都是docx,文档格式公开,遵循XML路线 ...
计算机二级地15套题答案,计算机二级第15套答案解析.docx
Word 15 答案 1 ．[解析] 打开考生文件夹下的"Word 素材 .docx"文件.单击"文件" |"另存为"按钮, 打开&quo ...
Java:使用POI实现word的docx文件的模板功能
一:场景通过Word模板来实现动态的word生成二: 基本要求 1:替换文本中的内容 2:替换表格中的内容(不用动态生成表格) 3:替换后的内容应该与替换前的内容格式相同 4:模板修改方 ...
使用document解析xml文件
在慕课上课时,看到可以使用document来解析xml文件,把上课的代码放出来,先记录一下. 大概步骤如下: 1.使用DocumentBuilderFactory 创建对象后再创建DocumentBu ...
python读取docx文件_Python 实现docx文件的读写操作
我们在做一些数据统计或分析的时候,有时会接触到Execl 格式或者Word 格式的文件.Execl格式的数据提取和解析,我们在之前的文章分享过一些非常好用的Python第三方库,本文中主要介绍如何使用 ...
RTF 批量转换为 DOCX 文件
RTF 批量转换为 DOCX 文件 RTF是多信息文本格式,可用于多设备.系统.最近在做一个小的数据批量处理程序时遇到了RTF格式的数据文件,这种格式虽然跨设备跨系统,但是发现解析此格式的库比较少 ...
Java通过Freemarker生成docx文件
一:doc和docx文件首先我们要了解doc和docx两种word文件的相同点和不同点,为什么ftl可以直接生成doc而生成docx就会报错. 1.doc和docx文件构成我们可以把doc格式的w ...
python读取docx中表格图片_python 解析docx文档的方法，以及提取插入的文本对象和图片...
首先安装docx模块,通过pip install docx或者在docx官方链接上下载安装都可以下面来看下如何解析docx文档:文档格式如下有3个部分组成 1 正文:text文档 2 一个表格. ...

mammothJs解析docx文件

mammothJs解析docx文件相关推荐

最新文章

热门文章