最近有朋友問js 如何打印預覽,今天就來講解一下,首先了解一下打印原理,其實局部打印頁面很簡單。就是把你需要打印的部分做一個起始標記,至於標記如何寫,隨便你寫什麼。我這裡就寫 <!--startprint--> 需要打印的內容
<!--endprint-->. 因為標記是不需要讓用戶看見的所以加了注釋!具體實現代碼如下:
<!DOCTYPE html> <html> <head> <title>打印預覽簡單實現</title> </head> <body> <div> 這是body 裡的內容不需要打印,具體的頁面設計根據自己的要求自行設計。如果需要一個頁面多個tag,可以動態生成tag </div> <!--startprint--> <div> 這是我需要打印的內容 </div> <!--endprint--> <script type="text/javascript"> function preview() { var bdhtml=window.document.body.innerHTML;//獲取當前頁的html代碼 var startStr="<!--startprint-->";//設置打印開始區域 var endStr="<!--endprint-->";//設置打印結束區域 var printHtml=bdhtml.substring(bdhtml.indexOf(startStr)+startStr.length,bdhtml.indexOf(endStr));//從標記裡獲取需要打印的頁面 window.document.body.innerHTML=printHtml;//需要打印的頁面 window.print(); window.document.body.innerHTML=bdhtml;//還原界面 } preview(); </script> </body> </html>