本文介绍如何利用 JavaScript 实现网页指定区域的打印功能。核心原理是通过 window.open 打开新窗口，使用 document.write 将目标 div 的 innerHTML 写入新文档，调用 print 执行打印后关闭窗口。文章提供了完整的函数定义及 HTML 调用示例，适用于需要局部打印的 Web 开发场景。
打印指定区域的核心原理
JavaScript 实现打印页面指定 div 区域的原理如下：首先利用 window.open() 方法在浏览器中打开一个新的窗口；接着通过 window.document.write() 将指定 div 区域的内容写入新窗口的文档中；随后调用 document.close() 关闭文档流；最后使用 window.print() 调用系统打印机打印当前文档内容。
JavaScript 打印函数实现
JavaScript 打印函数 myPrint(obj) 的定义如下：
代码如下:
function myPrint(obj){
//打开一个新窗口newWindow
var newWindow=window.open("打印窗口","_blank");
//要打印的div的内容
var docStr = obj.innerHTML;
//打印内容写入newWindow文档
newWindow.document.write(docStr);
//关闭文档
newWindow.document.close();
//调用打印机
newWindow.print();
//关闭newWindow页面
newWindow.close();
}函数调用与完整实例
myPrint() 函数的调用方法如下：
代码如下:
myPrint(document.getElementById('printDivID'));实例代码展示如下：
代码如下:
<script>
function myPrint(obj){
var newWindow=window.open("打印窗口","_blank");
var docStr = obj.innerHTML;
newWindow.document.write(docStr);
newWindow.document.close();
newWindow.print();
newWindow.close();
}
</script>
<div id="print">
<hr />
打印演示区域,点击打印后会在新窗口加载这里的内容！
<hr />
</div>
<button onclick="myPrint(document.getElementById('print'))">打 印</button>