打印DIV内容的最佳方法是什么？
打印DIV的内容
- 开启新视窗
- 打开新窗口的文档对象，并向其中写入一个简单的文档，其中仅包含您拥有的div和必要的html标头等-您可能还希望将文档放入样式表中，具体取决于您的内容是
- 将脚本放在新页面中以调用window.print（）
- 触发脚本
尽管@BC答案是最好的打印一页。
但是，使用ctrl + P同时打印多页A4尺寸的页面可能会有所帮助。
@media print{
html *{
height:0px!important;
width:0px !important;
margin: 0px !important;
padding: 0px !important;
min-height: 0px !important;
line-height: 0px !important;
overflow: visible !important;
visibility: hidden ;
}
/*assing myPagesClass to every div you want to print on single separate A4 page*/
body .myPagesClass {
z-index: 100 !important;
visibility: visible !important;
position: relative !important;
display: block !important;
background-color: lightgray !important;
height: 297mm !important;
width: 211mm !important;
position: relative !important;
padding: 0px;
top: 0 !important;
left: 0 !important;
margin: 0 !important;
orphans: 0!important;
widows: 0!important;
overflow: visible !important;
page-break-after: always;
}
@page{
size: A4;
margin: 0mm ;
orphans: 0!important;
widows: 0!important;
}}
我编写了一个插件来解决这种情况。我对那里的插件不满意，并着手进行更广泛的配置。
我认为有更好的解决方案。使div打印以覆盖整个文档，但仅在打印时：
@media print {
.myDivToPrint {
background-color: white;
height: 100%;
width: 100%;
position: fixed;
top: 0;
left: 0;
margin: 0;
padding: 15px;
font-size: 14px;
line-height: 18px;
}
}
function printdiv(printdivname) {
var headstr = "<html><head><title>Booking Details</title></head><body>";
var footstr = "</body>";
var newstr = document.getElementById(printdivname).innerHTML;
var oldstr = document.body.innerHTML;
document.body.innerHTML = headstr+newstr+footstr;
window.print();
document.body.innerHTML = oldstr;
return false;
}
这将打印div您想要的区域，并将内容设置回原样。printdivname是div要打印的。
最好的方法是将div的内容提交到服务器，然后打开一个新窗口，服务器可以在其中将这些内容放入新窗口。
如果不是这样，您可以尝试使用诸如javascript之类的客户端语言来隐藏除div之外的所有内容，然后打印该页面...