使用window.print()调用打印机功能来实现页面打印

通过window.print()调用打印机功能，打印当前页面：

window.print();

如果需要局部打印，一般是为window.document.body.innerHTML设置打印内容：

window.document.body.innerHTML=window.document.getElementById("id选择器").innerHTML;
window.print();

window.print()实现局部打印的三种方式：

首先准备要打印的内容，html中定义如下：

<!--startprint-->
<div id="print_content" style="display:none">
打印内容
</div>
<!--endprint-->

（1）通过设置打印内容标记（startprint、endprint），实现局部打印

function print() {
	//获取页面内容
	bdhtml = window.document.body.innerHTML; 
	//定义打印标识（开始标识、结束标识）
	sprnstr = "<!--startprint-->";
	eprnstr = "<!--endprint-->";
	//截取打印内容
	prnhtml = bdhtml.substr(bdhtml.indexOf(sprnstr)+17);
	prnhtml = prnhtml.substring(0,prnhtml.indexOf(eprnstr));
	//设置body内容
	window.document.body.innerHTML = prnhtml;
	//调用打印机功能
	window.print();
	//重置body内容
	window.document.body.innerHTML = bdhtml;
	return false;
}

（2）通过内容选择器获取内容，来实现局部打印

function print(){
	//获取页面内容
	bdhtml = window.document.body.innerHTML;
	//根据选择器获取打印内容
	prnhtml = document.getElementById("print_content").innerHTML;
	//设置body内容
	window.document.body.innerHTML = prnhtml; 
	//调用打印机功能
	window.print();
	//重置body内容
	window.document.body.innerHTML = bdhtml;
	return false;
}

（3）通过动态创建”iframe“，来实现局部打印（推荐的方法）

function print(){
	//判断iframe是否存在：目的减少内存消耗
	var iframe = document.getElementById("print-iframe");
	
	if(!iframe){
		//根据选择器获取打印内容
		var printobj = document.getElementById("printcontent");
		
		//创建iframe标签
		iframe = document.createElement('iframe');
		iframe.setAttribute("id", "print-iframe");
		iframe.setAttribute('style', 'position:absolute;width:0px;height:0px;left:-500px;top:-500px;');
		
		//将iframe添加文档中
		document.body.appendChild(iframe);
		
		var doc = iframe.contentWindow.document;
		//设置自定义样式
		doc.write("<LINK rel="stylesheet" type="text/css" href="css/print.css">");
		//设置打印内容
		doc.write('<div>' + printobj.innerHTML + '</div>');
		//关闭文档
		doc.close();
		
		iframe.contentWindow.focus();            
	}
	iframe.contentWindow.print();  
}

参考：window.print()局部打印三种方式

很赞哦！ (2)

转载：感谢您对初柒先生个人网站的认可！如果您喜欢我们的文章，我们非常地欢迎各位朋友进行转载，但转载请在文章末尾备注“本文来源：初柒先生个人网站”。

初柒先生 2019-12-06 19:10 【js】 252人已围观