打印web頁面指定區域的三種方法

本文和大家分享一下web頁面實現指定區域打印功能的三種方法，一起來看下吧。

　　第一種方法：使用CSS

　　定義一 個.noprint的class，將不打印的內容放入這個class內。

　　代碼如下：

<style media="print" type="text/css"> 
.noprint{visibility:hidden} 
</style>
這 里是要打印的內容。
<p class="noprint">這里是不打印的內容。</p>
<a href="javascrīpt:window.print()" target="_self"& gt;打印</a>

　　第二種方法：指定打印區域

　 　把要打印的內容放入一個span或div，然后通過一個函數打印。

　　代碼如下：

<span id="div1">這里是要打印的內容</span& gt;
<p>所有內容</p>
<div id="div2">div2的內容</div& gt;
<a href="javascrīpt:printme()" target="_self">打印</a>
<script language="javascript">
function printme(){
 document.body.innerHTML=document.getElementById('div1').innerHTML+'<br/>'+document.getElementById('div2').innerHTML;
 window.print();
}
</script>

　 　如果要打印的只是整個頁面中的一小部分，最好采用第二種方法。

　　第三種方法：如果要打印的頁面排版和原web頁面相差很大，采用此種 方法。

　　點擊打印按鈕彈出新窗口，把需要打印的內容顯示到新窗口中，在新窗口中調用window.print()方法，然后自動關閉新 窗口。

 

網頁設計----打印網頁指定區域

<script language=javascript>
function doPrint() { 
bdhtml=window.document.body.innerHTML; 
sprnstr="<!--startprint-->"; 
eprnstr="<!--endprint-->"; 
prnhtml=bdhtml.substr(bdhtml.indexOf(sprnstr)+17); 
prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr)); 
window.document.body.innerHTML=prnhtml; 
window.print(); 
window.document.body.innerHTML=bdhtml;
}
</script>

<!--startprint-->在需要打印的內容<!--endprint-->

<input type="button" onClick="doPrint()" value="打印" /> 

// 頁面上的內容大小調整可以css調整或容器包容 打印容器內的內容就可以了