destoon上做纯js实现html指定页面导出word
因为最近做了范文网站需要,所以要下载为word文档,如果php进行处理,很吃后台服务器,所以想用前端进行实现。查询github发现,确实有这方面的插件。
js导出word文档所需要的两个插件:
1
2
|
FileSaver.js jquery.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路分支.会签.聚合.多重聚合.退回. ...
随机推荐
- CtfShow信息收集1-20攻略
CtfShow信息收集1-20关攻略 简单更新一下CTF关于信息收集的题目,总共20道,网站地址:https://ctf.show/challenges 第一关 我们可以看到提示:开发注释没有及时删除 ...
- 前端Vue图片上传组件支持单个文件多个文件上传 自定义上传数量 预览删除图片 图片压缩
前端Vue图片上传组件支持单个文件多个文件上传 自定义上传数量 预览删除图片 图片压缩, 下载完整代码请访问uni-app插件市场址:https://ext.dcloud.net.cn/plugin? ...
- ElasticSearch - 批量更新bulk死锁问题排查
一.问题系统介绍 监听商品变更MQ消息,查询商品最新的信息,调用BulkProcessor批量更新ES集群中的商品字段信息; 由于商品数据非常多,所以将商品数据存储到ES集群上,整个ES集群共划分了2 ...
- Java protected 关键字详解
很多介绍Java语言的书籍(包括<Java编程思想>)都对protected介绍的比较的简单,基本都是一句话,就是: 被 protected 修饰的成员对于本包和其子类可见.这种说法有点太 ...
- 从TL、ITL到TT
1.概述 ThreadLocal(TL)是Java中一种线程局部变量实现机制,他为每个线程提供一个单独的变量副本,保证多线程场景下,变量的线程安全.经常用于代替参数的显式传递. Inheritable ...
- 手写raft(一) 实现leader选举
1. 一致性算法介绍 1.1 一致性同步与Paxos算法 对可靠性有很高要求的系统,通常都会额外部署1至多个机器为备用副本组成主备集群,避免出现单点故障. 有状态的系统需要主节点与备用副本间以某种方式 ...
- MyBatis(log4j)
log4j介绍 Log4j是Apache的一个开源项目,通过使用Log4j,我们可以控制日志信息输送的目的地是控制台.文件.GUI组件,甚至是套接口服务器.NT的事件记录器.UNIX Syslog守护 ...
- 信奥赛题1001:Hello,World!
这个题实在是太简单的了,无法比喻,直接付代码! //c++ #include<bits/stdc++.h> using namespace std; int main() { cout&l ...
- 【笔记】- 【美团1万台 Hadoop 集群 YARN 的调优之路】
原文:美团1万台 Hadoop 集群 YARN 的调优之路 背景 架构 YARN架构 资源抽象 YARN调度架构 资源抽象 调度流程 作业的组织方式 核心调度流程 指标 业务指标:有效调度 系统性能指 ...
- 通过Proxy和Reflect实现vue的响应式原理
vue3通过Proxy+Reflect实现响应式,vue2通过defineProperty来实现 Proxy Proxy是什么 Proxy是ES6中增加的类,表示代理. 如果我们想要监听对象的操作过程 ...