js打印页面源码 ，打印选取的容器里的内容，打印指定内容
效果
代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>打印测试</title>
</head>
<body>
<div id="printBox">
<h1>打印h1</h1>
<h2>打印h2</h2>
<h3>打印h3</h3>
<ul>
<li>ul-li-1</li>
<li>ul-li-2</li>
<li>ul-li-3</li>
</ul>
<ol>
<li>ol-li-1</li>
<li>ol-li-2</li>
<li>ol-li-3</li>
</ol>
</div>
<button onclick="printFun('printBox')">打印</button>
<script>
var printFun=function(domId){
console.log('打印');
var u = window.open("\u6253\u5370\u7a97\u53e3", "_blank",'',true);
var v=document.querySelector('#'+domId).innerHTML;
u.document.write(v),u.document.close(),u.print(),u.close();
}
</script>
</body>
</html>代码解读
html代码解析
这里有一个容器，是用来装载需要打印的内容
<div id="printBox">按钮是为了触发打印事件
<button onclick="printFun('printBox')">打印</button>JS代码解析
Unicode码
\u6253\u5370\u7a97\u53e3
的意思的
“打印窗口”这个属于 Unicode码
为什么要这样写，是方便传参，且，浏览器会自动解析成中文
提供一个在线工具：Unicode编码转换 - 站长工具
Unicode编码转换 - 站长工具
新增一个打印窗体
这里新增一个窗体后是获取了这个窗体对象，方便后续操作这个窗体对象
var u = window.open("\u6253\u5370\u7a97\u53e3", "_blank",'',true); 方法解释
var u = window.open("名称", "是否弹出一个新的窗体",'',URL 替换浏览历史中的当前条目); 具体可参考下面文章
window.open()的用法,js打开新窗体_window.open 干净的窗体-CSDN博客
获取当前需要打印的容器内容
var v=document.querySelector('#'+domId).innerHTML;u.document.write(v)//写入内容
u.document.close()//关闭文档
u.print()//触发打印
u.close();//关闭
