很多网站都有此功能，当浏览到底部时都会有一个打印按钮，点击打印按钮就可以完成打印功能，功能非常不错，人性化，下面通过本文给大家介绍JavaScript实现点击按钮就打印的代码，需要的朋友参考下很多网站都有此功能，当浏览到底部时都会有一个打印按钮，点击打印按钮就可以完成打印功能，功能非常不错，人性化，代码非常的简单。

也就是只要调用window.print()函数就可以实现打印当前页面。


但是上面的并不完美，因为有些网页上的很多内容都不需要打印，下面介绍一下如何打印页面中的指定内容。


代码如下:


<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="http://www.jb51.net/" />

<title>指定被打印的内容</title>

<script language="javascript"> 

function printdiv(printpage) 

{ 

var newstr = printpage.innerHTML; 

var oldstr = document.body.innerHTML; 

document.body.innerHTML =newstr; 

window.print(); 

document.body.innerHTML=oldstr; 

return false; 

} 

window.οnlοad=function()

{

var bt=document.getElementById("bt");

var div_print=document.getElementById("div_print");

bt.οnclick=function()

{

printdiv(div_print);

}

}

</script> 

</head> 

<body> 

<div id="div_print"> 

<h1 style="Color:Red">这是要被打印的内容</h1> 

</div>

<div style="Color:Red">欢迎您</div> 

<input name="print" type="button" id="bt" value="点击打印" /> 

</body> 

</html>


特别说明:打印预览需要将代码复制到本机测试，否则会出错。


以上代码实现了打印网页指定内容的效果，下面简单介绍一下实现过程。


一.实现原理:


在js代码中使用document.body.innerHTML =newstr，动态原来body中的内容替换为要打印的内容，在打印过后，在将原来的内容还原，原理就是这么简单，具体可以参阅代码注释。


二.代码注释:


1.function printdiv(printpage){},声明一个控制打印的函数，参数是一个对象，这个对象中的内容将要被打印。

2.var newstr = printpage.innerHTML; ，获取要打印的内容。

3.var oldstr = document.body.innerHTML，原来body中的内容。

4. document.body.innerHTML =newstr，用将要打印的内容替换原来body中的内容。

5.window.print()，开始打印。

6.document.body.innerHTML=oldstr，再将原来body中的内容还原。