js实现网页的过滤打印（去掉你不想出现的内容）

首先，我们理解打印的过程，控制页面打印有很多种方法，这里我只讲最简单的一种。

打印分三步：

打印前，打印和打印后。

过滤的原理其实很简单，就是打印前将不该显示的元素全部display = none

然后打印后，再将页面修改回来。

废话不多说：

① 我们首先要注册两个函数

window.οnbefοreprint=beforePrint;
window.οnafterprint=afterPrint;

②编写打印前的过滤函数和打印后的恢复函数

//打印之前隐藏不想打印出来的信息
function beforePrint(){$('.navbar').hide();  //隐藏头部$('#page-header').hide(); //隐藏面包屑$('#block-region-side-pre').hide(); //隐藏左侧导航栏}
//打印之后将隐藏掉的信息再显示出来
function afterPrint(){ $('.navbar').show();  //显示头部$('#page-header').show(); //显示面包屑$('#block-region-side-pre').show(); //显示左侧导航栏

③给dom元素注册打印事件，要包含三个函数，顺序不能乱。

<button id="myprint" οnclick="beforePrint();window.print();afterPrint();">打印</button>

至此，点击“打印” 按钮，即可过滤掉你不想要的页面元素了。

可是问题又来了。

我的页面顶部出现了 title的内容和网址，底部也出现了不该出现的东西，怎么办？

用js程序可以解决吗，可以，只是兼容性很差，你可以百度搜索“js去掉打印页眉和页脚”，你会发现，他会去调用ActiveX控件和windows注册表，Linux和其他操作系统有吗？Firefox会自动给你安装ActiveX控件吗？

答案是否定的。

你干嘛那么懒呢？一步配置浏览器就好了，如下：

看看谷歌：不勾选页眉和页脚

看看火狐：所有的都选择空白

其他浏览器，当然如出一辙。

js实现网页的过滤打印（去掉你不想出现的内容）相关推荐

使用html2canvas.min.js将网页生成图片并打印(笔记记录)
<iframe id="downloadFrame" style="display:none;"></iframe> //打印 func ...
js 实现网页一个一个字打印出来的效果
最近看了一个小效果,感觉还挺不错,代码实现起来也挺简单,于是就写了些. html: <textarea id="showStr"></textarea> / ...
js控制台 console 骚操作-打印图片-自定义样式-字符画
目录控制台打印骚操作自定义样式打印(输出)图片借助平台打印字符(符号组成) Lunicode 平台操作图片转字符打印控制台打印骚操作二效果图代码实现错误案例方式一(感觉有点乱) 方 ...
网页中JS实现（调用）打印预览功能
近期的项目中需要在页面中实现打印预览功能--点击网页中的"打印"(Print),弹出打印预览窗口,点击窗口页面中的"开始打印"(Print),则出现浏览器的打印 ...
Jquery、Js实现网页打印，及打印样式的自定义
本来今天准备继续更新webpack的内容的,但是上午修改了一下公司网站的代码,然后就开始研究网页打印的东西了,弄了一下午,搞的整个人都不好了.刚好也来讲一下一些收获,其实也不算什么收获,但是还是来跟大 ...
JS判断网页广告是否被浏览器拦截过滤的代码
这篇文章主要介绍了JS判断网页广告是否被浏览器拦截过滤的代码,需要的朋友可以参考下本来现在投广告赚钱也不像前几年好做,现在还大部分浏览器都拦截了广告,很多浏览器还是默认拦截广告,做站长不是一般辛苦啊 ...
vue js 打印去掉页脚的链接，去掉页眉页脚
打印 <div style="padding-top: 15px;width:100px;"><el-button type="primary" ...
关于js渲染网页时爬取数据的思路和全过程（附源码）
于js渲染网页时爬取数据的思路首先可以先去用requests库访问url来测试一下能不能拿到数据,如果能拿到那么就是一个普通的网页,如果出现403类的错误代码可以在requests.get()方法里 ...
JAVA根据word模板生成合同，并能实现网页在线浏览/打印/下载
最近, 项目有这样一个需求: 根据我选择的模板(docx文件),和我表单填的数据,生成相应的合同文件(docx),该合同要能网页在线浏览/打印/下载在合同中还要放置签字图片和身份证图片我 ...

js实现网页的过滤打印（去掉你不想出现的内容）

js实现网页的过滤打印（去掉你不想出现的内容）相关推荐

最新文章

热门文章