js使用页面打印window.print() 记录，并进行缩放打印

最新推荐文章于 2026-04-17 11:47:29 发布

原创最新推荐文章于 2026-04-17 11:47:29 发布 · 1.9w 阅读

12 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#js页面打印

web 前端打印专栏收录该内容

1 篇文章

订阅专栏

本文介绍了一种网页打印优化的方法，包括页面内容的获取与替换、页面缩放设置、IE浏览器下的页眉页脚消除以及Chrome下的CSS样式调整。适用于IE11、Chrome、Firefox和Edge等浏览器。

  //打印
   print:function(){
 	 //获取打印的页面内容
      let subOutputRankPrint = document.getElementById('print-div');
      let newContent = subOutputRankPrint.innerHTML;
      let oldContent = document.body.innerHTML;
      document.body.innerHTML = newContent;
	//页面打印缩放比例设置
     document.getElementsByTagName('body')[0].style.zoom=0.92;
     //检测是否是IE 如果是ie进行页眉页脚
    if(!!window.ActiveXObject || "ActiveXObject" in window){
        var hkey_root, hkey_path, hkey_key;
        hkey_path = "HKEY_CURRENT_USER\\Software\\Microsoft\\Internet"+ 						  
        "Explorer\\PageSetup\\";
        try {
         var RegWsh = new ActiveXObject("WScript.Shell");
         RegWsh.RegWrite(hkey_path + "header", "");
         RegWsh.RegWrite(hkey_path + "footer", "");
        } catch (e) {}
    }
      window.print();
      window.location.reload();
      //将原有页面还原到页面
      document.body.innerHTML = oldContent;
      return false;
   },
}

//chrome下进行页眉页脚消除使用css 样式进行消除
// 测试ie11,chrome,firefox,edge 可消除页眉页脚
@media print{
@page{
margin:0;
//控制是使用a4还是使用其它纸张规格
size:auto;
}
}