js将word文件转为html文件并读取到文本编辑器中（思路）

李博的前端篇

已于 2023-05-30 16:41:46 修改

阅读量1.9k

点赞数

文章标签： word

于 2023-04-21 11:44:59 首次发布

本文链接：https://blog.csdn.net/m0_63498341/article/details/130284824

版权

思路：

1、首先word保存的时候另存为html格式（word自带功能）··

2、在页面html部分编写一个文件上传input框

3、input框上传文件的回调函数中使用FileReader()读取文件

4、将读取的内容赋值给编辑器即可

以下是代码实现：

此处使用的编辑器为:(wangeditor)

<body>
    <input v-show="false" id="changeFile" ref="fileRef" style="display: block;" type="file"         @change="fileChange" accept=".doc,.docx">
</body>

<script>
    
     fileChange(res) {
      if (res.srcElement.files && res.srcElement.files.length > 0) {
        this.analysisWord(res.srcElement.files[0]).then((value)=>{
            editor.dangerouslyInsertHtml('')
            editor.dangerouslyInsertHtml(value)
            res.target.value=''
        })
    
  
      }
    },
    analysisWord(file) {
      return new Promise((resolve) => {
        const reader = new FileReader();
        reader.readAsText(file,'GB2312')
        reader.onload = function (evt) {
          const fileString = evt.target.result  // 读取文件内容
          resolve(fileString);
        }
      })
    },
</script>