一.打印當(dāng)前頁(yè)面指定元素中的內(nèi)容

方式一：直接使用window.print();

（1）首先獲得元素的html內(nèi)容（這里建議如果有樣式最好是用內(nèi)聯(lián)樣式的方式）

  var newstr = document.getElementById(myDiv).innerHTML;//得到需要打印的元素HTML

（2）保存當(dāng)前頁(yè)面的整個(gè)html，因?yàn)閣indow.print()打印操作是打印當(dāng)前頁(yè)的所有內(nèi)容，所以先將當(dāng)前頁(yè)面保存起來(lái)，之后便于恢復(fù)。

var oldstr = document.body.innerHTML;//保存當(dāng)前頁(yè)面的HTML

（3）把當(dāng)前頁(yè)面替換為打印內(nèi)容HTML

document.body.innerHTML = newstr;

（4）執(zhí)行打印操作

window.print();

（5）還原當(dāng)前頁(yè)面

document.body.innerHTML = oldstr;

方法例：

//myDiv為需要打印的元素ID

function printpage(myDiv){    
var newstr = document.getElementById(myDiv).innerHTML;
var oldstr = document.body.innerHTML; 
document.body.innerHTML = newstr; 
window.print(); 
document.body.innerHTML = oldstr; 
return false; 
}

方式二：window.open("",..)新開(kāi)瀏覽器對(duì)話框打印。

（1）獲得需要打印的元素HTML

var printHtml = document.getElementById("myDiv").innerHTML;//這個(gè)元素的樣式需要用內(nèi)聯(lián)方式，不然在新開(kāi)打印對(duì)話框中沒(méi)有樣式

（2）打開(kāi)一個(gè)窗口，且內(nèi)容設(shè)置為空。

var wind = window.open("",'newwindow', 'height=300, width=700, top=100, left=100, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=n o, status=no');

（3）將新窗口內(nèi)容填充為需要打印的HTML內(nèi)容

wind.document.body.innerHTML = printHtml;

（4）打印

wind.print();

方法例：

//myDiv為需要打印的元素ID

function printpage(myDiv){    
var printHtml = document.getElementById(myDiv).innerHTML;

var wind = window.open("",'newwindow', 'height=300, width=700, top=100, left=100, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=n o, status=no');

wind.document.body.innerHTML = printHtml;

wind.print();
return false; 
}

二、打印通過(guò)url獲取的內(nèi)容

直接使用

var wind = window.open(url,'newwindow', 'height=300, width=700, top=100, left=100, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=n o, status=no');

wind.print();

對(duì)方url返回的所有內(nèi)容都會(huì)被打印，，，如果知道需要打印指定內(nèi)容的ID，可以先將頁(yè)面獲取到，然后通過(guò)一、中的方式打印。

即可打印；

三、功能實(shí)現(xiàn)總結(jié)

我做這個(gè)打印是為了打印一個(gè)面單就像包裹上面貼的，有收寄信息，公司log圖片，

1.經(jīng)過(guò)測(cè)試，如果使用火狐瀏覽器,有可能圖片會(huì)變模糊（不排除是因?yàn)槲也僮鞣椒](méi)對(duì)），但是同樣的操作在其他瀏覽器，比如google沒(méi)有出現(xiàn)。（有些差異，用不同瀏覽器執(zhí)行即可看出）

2.如果頁(yè)面是自己系統(tǒng)直接打印還好。如果是為了給別人提供接口，讓對(duì)方獲得頁(yè)面內(nèi)容而打印，那么，頁(yè)面中的路徑一定要帶http前綴，不然在對(duì)方域名下就沒(méi)有對(duì)應(yīng)圖片。

3.打印有可能有頁(yè)眉頁(yè)腳，這個(gè)解決方法是 換合適的瀏覽器，比如google調(diào)用打印的時(shí)候就沒(méi)有頁(yè)眉頁(yè)腳，遨游瀏覽器提供了顯示選擇。

3.尺寸不對(duì)應(yīng)，因?yàn)轫?yè)面是用像素布局，而打印是用的毫米之類的單位，這個(gè)是沒(méi)法進(jìn)行換算的，跟顯示器有關(guān)，但是我們只要控制好整體長(zhǎng)寬比就好，具體大小就無(wú)所謂了。然后打印時(shí)，比如遨游瀏覽器，就可以設(shè)置打印比例（其他瀏覽器應(yīng)該都可以）。根據(jù)實(shí)際需求調(diào)整即可。

其他疑問(wèn)：

1.有更好的方式比如有個(gè) css的打印媒體類型（這個(gè)我不太懂，也沒(méi)多了解）等更好的解決前端打印需求的，還請(qǐng)多多交流補(bǔ)充。

2.是否可以通過(guò)JS直接控制打印比例，和打印的頁(yè)面去留。（我沒(méi)有找到合適有效的方法）