原生JS页面打印隐藏不想要的数据,以及分页处理

  • Post author:
  • Post category:其他


1.js打印是调用 window.print() 这个方法。

2.因为window.print()是打印整个页面,但有的时候我们想隐藏掉部分页面上的数据的话,该怎么处理呢 ?

3.这个时候我们可以通过css样式来控制打印时候的样式
在这里插入图片描述

打印前:

在这里插入图片描述

打印后(

隐藏了左侧的名字和头部导航

):

在这里插入图片描述

代码如下:


< style media=“printTest”>

@media print {


.nodayin {


display: none;

}

}

< /style>

4.如果我们需要把学生的数据进行分页处理,也就是

打印的时候学生的错题和错题解析不能同时出现在一张纸上



这个时候可以用到css的

分页符



<div

style=“page-break-after:always”>


,这样的话学生的错题和解析就会各自新起一页,便于查看。

在这里插入图片描述



版权声明:本文为IamsbOOOO原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。