web端实现打印页面指定内容，并打印成功与取消后不影响原页面事件

最新推荐文章于 2024-07-03 23:56:01 发布

倔强小李

最新推荐文章于 2024-07-03 23:56:01 发布

阅读量59

点赞数

文章标签：前端 javascript 开发语言

原文链接：https://blog.csdn.net/weixin_49066399/article/details/135437882

版权

		//这里是获取我需要打印的dom 元素
        let wpt = document.getElementById('myDiv');
        let newContent = wpt.innerHTML;
        //创建iframe
        const iframeEl = document.createElement("iframe");
        iframeEl.class = "iframe";
        //将元素放置最底层，防止其覆盖了其他元素
        iframeEl.style.position = "fixed";
        iframeEl.style.zIndex = -99;
        //添加到页面
        document.querySelector("body").append(iframeEl);
        const documentEl = iframeEl.contentDocument;
        //把打印dom元素赋值给iframe
        documentEl.body.innerHTML = newContent;
        iframeEl.contentWindow.print()

注意：需打印内容需要使用行内样式，不然打印时样式无效

原文地址：https://blog.csdn.net/weixin_49066399/article/details/135437882