destoon上做纯js实现html指定页面导出word
因为最近做了范文网站需要,所以要下载为word文档,如果php进行处理,很吃后台服务器,所以想用前端进行实现。查询github发现,确实有这方面的插件。
js导出word文档所需要的两个插件:
|
1
2
|
FileSaver.jsjquery.wordexport.js |
首先引入:
|
1
2
3
4
|
<!--生成word!--><script src="https://cdn.bootcss.com/jquery/2.2.4/jquery.js"></script><script src="http://www.nongpin88.com/skin/default/js/FileSaver.js"></script><script src="http://www.nongpin88.com/skin/default/js/jquery.wordexport.js"></script> |
html导出按钮:
|
1
|
<input type="button" value="导出word" onclick="doWord()" style="color:#FFFFFF;width:70px;height:20px;border-radius: 5px;"> |
js过滤部分:
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<script>function doWord(){document.getElementsByClassName('article-mp_msg')[0].style.display="none";document.getElementsByClassName('article-msg')[0].style.padding="20px";document.getElementsByClassName('article-title')[0].style.textAlign ="center";document.getElementsByClassName('article-detail_inner')[0].style.margin ="auto"; bdhtml=window.document.body.innerHTML; sprnstr="<!--startprint-->"; eprnstr="<!--endprint-->"; prnhtml=bdhtml.substr(bdhtml.indexOf(sprnstr)+17); prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr)); var re1 = /<img.*?(?:>|\/>)/gi;//匹配html标签的正则表达式,"g"是搜索匹配多个符合的内容prnhtml = prnhtml.replace(re1,'');//执行替换成空字符 var re2 = /<([a-z]+?)(?:\s+?[^>]*?)?>\s*?<\/\1>/ig; prnhtml = prnhtml.replace(re2,'');//执行替换成空字符 window.document.body.innerHTML=prnhtml; $(".article-detail_inner").wordExport('文章的标题'); }</script> |
这样就搞定了,看看效果吧!
体验地址:攻略-第2页-9335游戏网
destoon上做纯js实现html指定页面导出word的更多相关文章
- js 图片压缩上传(纯js的质量压缩,非长宽压缩)
下面是大神整理的demo,很实用,这里存一下备用,感谢大神! 此demo为大于1M对图片进行压缩上传 若小于1M则原图上传,可以根据自己实际需求更改. demo源码如下 <!DOCTYPE ht ...
- 前端图片压缩上传(纯js的质量压缩,非长宽压缩)
此demo为大于1M对图片进行压缩上传 若小于1M则原图上传,可以根据自己实际需求更改. demo源码如下: <!DOCTYPE html> <html> <head&g ...
- 图片上传 纯js编码
ie8测试始终不支持,非ie方法一.二都正常 <!DOCTYPE html> <html lang="zh"> <head> <meta ...
- js如何在指定页面跳转到另一指定页面
要实现从一个页面A跳到另一个页面B,js实现就在A的js代码加跳转代码 JS跳转大概有以下几种方式: 第一种:(跳转到b.html)<script language="javascri ...
- pc或者微信上用pdf.js在线预览pdf和word
最近项目要求pdf和word可以在线预览功能,pc端还好解决,但是微信端就有点坑了,pc端原来的思路是将文件转成base64,然后用html格式显示 ,但是微信端不支持, 这种方式就pass掉了,谷歌 ...
- JS 如何将 HTML 页面导出为多页 PDF
参考链接:https://blog.csdn.net/pwc1996/article/details/70141383
- js jquery jquery.wordexport.js 实现导出word
由于工作需要,将一个页面导出word文档,主要是简历!经过百度搜索之后,没找到结果,无奈之下只能求助Google,意外发现jquery一款插件可以实现这个功能!而且效果还算可以! 基本可以实现想要的功 ...
- js在table指定tr行上或底下添加tr行
js在table指定tr行上或下面添加tr行 function onAddTR(trIndex) { var tb = document.getElementB ...
- F2工作流引擎之-纯JS Web在线可拖拽的流程设计器(八)
Web纯JS流程设计器无需编程,完全是通过鼠标拖.拉.拽的方式来完成,支持串行.并行.分支.异或分支.M取N路分支.会签.聚合.多重聚合.退回.传阅.转交,都可以非常方便快捷地实现,管理员 ...
- 纯JS Web在线可拖拽的流程设计器
F2工作流引擎之-纯JS Web在线可拖拽的流程设计器 Web纯JS流程设计器无需编程,完全是通过鼠标拖.拉.拽的方式来完成,支持串行.并行.分支.异或分支.M取N路分支.会签.聚合.多重聚合.退回. ...
随机推荐
- 给你的 Discord 接入一个既能联网又能画画的 ChatGPT
如果有这样一款 Discord 机器人,它既能访问互联网,又能绘画,还能给 YouTube 视频提供摘要.最重要的是,它是完全免费的,不需要提供 OpenAI 的 API Key,我就问你香不香? 现 ...
- 搭建自动化 Web 页面性能检测系统 —— 实现篇
我们是袋鼠云数栈 UED 团队,致力于打造优秀的一站式数据中台产品.我们始终保持工匠精神,探索前端道路,为社区积累并传播经验价值.. 本文作者:琉易 liuxianyu.cn 前段时间分享了<搭 ...
- AWSBackup:备份您的云计算资源及数据
目录 <AWS Backup:备份您的云计算资源及数据> 背景介绍 随着云计算技术的不断普及,越来越多的企业开始将云计算资源视为其关键业务数据的潜在来源.同时,随着数据价值的不断增加,备份 ...
- Senparc.Weixin.MP SDK 微信公众平台开发教程(二十四):顺应 AIGC 应用,自动“续航”回复超长文本消息
开源地址 GitHub:https://github.com/JeffreySu/WeiXinMPSDK Gitee:https://gitee.com/JeffreySu/WeiXinMPSDK 概 ...
- springboot下使用rabbitMQ之开发配置方式(一)
springboot下使用rabbitMQ之开发配置方式(一) 距离上次发布博客已经小一年了,这次...嗯,没错,我又回来啦... 本次结合着B站某MQ视频以及最近在MQ上的实践聊一聊个人在使用rab ...
- PlayWright(二十一)- Pytest插件报告
1.下载 pytest框架有官方的报告pip install pytest-html 下载成功,那我们怎么使用呢? 2.使用 可以直接在配置文件里使用 在 pytest 配置文件中, 增加 ...
- CSP-S复习列表
DP:序列,区间,背包,多维,状压,树型 优化:滚动,单调性,树状数组 数据结构:栈,队,链,deque,priority_queue,vector,set,map 树状数组,分块思想 前缀和,差分思 ...
- 【Azure Event Hub】Event Hub的Process Data页面无法通过JSON格式预览数据
问题描述 在Event Hub的门户页面中,可以通过Process Data页面查看Event Hub中的数据,但是当使用JSON格式预览时(View in JSON),却出现错误. 消息一: No ...
- Nginx:超时 keeplive_timeout 配置
参考:Nginx的超时keeplive_timeout配置详解 HTTP 是一种无状态协议,客户端向服务器发送一个 TCP 请求,服务端响应完毕后断开连接. 如果客户端向服务器发送多个请求,每个请求都 ...
- 【动画进阶】有意思的 Emoji 3D 表情切换效果
最近,群里面的同学发了这么一个非常有意思是动画效果: 原效果地址 -- CodePen Demo -- Letter Hop 当然,原效果,主要使用了 GSAP 动画库以及一个 3D 文字 JavaS ...