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控件吗？

答案是否定的。

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

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

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

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