简单的html片段用word文档导出（无需服务处理，只需引入段js即可）

最新推荐文章于 2024-04-17 14:37:29 发布

qq_36408416

最新推荐文章于 2024-04-17 14:37:29 发布

阅读量534

点赞数

本文链接：https://blog.csdn.net/qq_36408416/article/details/84969297

版权

前段时间碰到过在页面上有个下载按钮需要把mongoDB 中的html数据在用word文档导出看了下poi 特别费劲，esaypoi对word文档导出也不友好，之后找到了一段js 只需把html数据写在页面上

$("#id").wordExport(导出文件名);

就可以直接导出word文档

if(typeof jQuery!=="undefined"&&typeof saveAs!=="undefined"){(function($){$.fn.wordExport=function(fileName){fileName=typeof fileName!=='undefined'?fileName:"jQuery-Word-Export";var static={mhtml:{top:"Mime-Version: 1.0\nContent-Base: "+location.href+"\nContent-Type: Multipart/related; boundary=\"NEXT.ITEM-BOUNDARY\";type=\"text/html\"\n\n--NEXT.ITEM-BOUNDARY\nContent-Type: text/html; charset=\"utf-8\"\nContent-Location: "+location.href+"\n\n<!DOCTYPE html>\n<html>\n_html_</html>",head:"<head>\n<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\">\n<style>\n_styles_\n</style>\n</head>\n",body:"<body>_body_</body>"}};var options={maxWidth:624};var markup=$(this).clone();markup.each(function(){var self=$(this);if(self.is(':hidden'))
    self.remove();});var images=Array();var img=markup.find('img');for(var i=0;i<img.length;i++){var w=Math.min(img[i].width,options.maxWidth);var h=img[i].height*(w/img[i].width);var canvas=document.createElement("CANVAS");canvas.width=w;canvas.height=h;var context=canvas.getContext('2d');context.drawImage(img[i],0,0,w,h);var uri=canvas.toDataURL("image/png");$(img[i]).attr("src",img[i].src);img[i].width=w;img[i].height=h;images[i]={type:uri.substring(uri.indexOf(":")+1,uri.indexOf(";")),encoding:uri.substring(uri.indexOf(";")+1,uri.indexOf(",")),location:$(img[i]).attr("src"),data:uri.substring(uri.indexOf(",")+1)};}
    var mhtmlBottom="\n";for(var i=0;i<images.length;i++){mhtmlBottom+="--NEXT.ITEM-BOUNDARY\n";mhtmlBottom+="Content-Location: "+images[i].location+"\n";mhtmlBottom+="Content-Type: "+images[i].type+"\n";mhtmlBottom+="Content-Transfer-Encoding: "+images[i].encoding+"\n\n";mhtmlBottom+=images[i].data+"\n\n";}
    mhtmlBottom+="--NEXT.ITEM-BOUNDARY--";var styles="";var fileContent=static.mhtml.top.replace("_html_",static.mhtml.head.replace("_styles_",styles)+static.mhtml.body.replace("_body_",markup.html()))+mhtmlBottom;var blob=new Blob([fileContent],{type:"application/msword;charset=utf-8"});saveAs(blob,fileName+".doc");};})(jQuery);}else{if(typeof jQuery==="undefined"){console.error("jQuery Word Export: missing dependency (jQuery)");}
    if(typeof saveAs==="undefined"){console.error("jQuery Word Export: missing dependency (FileSaver.js)");}}

qq_36408416

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
简单的html片段用word文档导出（无需服务处理，只需引入段js即可）

前段时间碰到过在页面上有个下载按钮需要把mongoDB 中的html数据在用word文档导出看了下poi 特别费劲，esaypoi对word文档导出也不友好，之后找到了一段js 只需把html数据写在页面上$("#id").wordExport(导出文件名);就可以直接导出word文档 if(typeof jQuery!=="undefined"&amp...
复制链接

扫一扫