提问人:shalomOlam 提问时间:4/17/2023 最后编辑:shalomOlam 更新时间:4/18/2023 访问量:287
如何在Chrome中访问打印窗口的HTML?[复制]
How to access the HTML of the print window in Chrome? [duplicate]
问:
我想编写打印网页的代码。print() 是不够的,因为它只打开浏览器的打印窗口,不会立即打印。此外,我还对控制打印选项(例如打印为 PDF 或特定尺寸)感兴趣。
于是,我在打开打印窗口的情况下打开了 Chrome 的开发者工具,复制了保存按钮的 js 路径,并尝试在我想打印的网页中编写以下代码:
print()
document.querySelector("body > print-preview-app").shadowRoot.querySelector("#sidebar").shadowRoot.querySelector("print-preview-button-strip").shadowRoot.querySelector("div > cr-button .action-button")click()
我遇到了一个错误,因为这个元素没有出现在页面本身上,而是出现在打印窗口中。事实证明,窗口实际上是一个单独的页面(chrome://print/),但在某种程度上,它被嵌入到打印的页面中,或者看起来与它无关。
我的问题是,在这种情况下,我如何在窗口上运行JS?
我的问题与这个问题绝对不同。那里的问题是关于插件的,问题是访问 chrome:// 页面,因为它们就是这样,浏览器不允许访问它们。但是我正在编写一个常规脚本(不是插件),因此它始终可以访问此类页面。就我而言,问题在于打印窗口不是网站页面的一部分,而是单独显示的。
我会再次澄清。我遇到的问题是访问当前页面以外的页面的 HTML。使用插件,实际上在技术上应该是可行的,但浏览器阻止了它。因此,如何使用插件执行此操作的问题与如何使用常规脚本执行此操作的问题不同。
后脚本。1.也许也可以直接使用Chrome打印的JS,但目前与我无关。问题是如何访问上面的 HTML 元素。
- 我见过类似的问题(比如这个)。我没有看到任何答案。
答:
我很遗憾地告诉你,这是不可能的。 另一方面,您可以随时使用警报 JS 库(如 sweetalert2),然后只需编辑警报 div 的内部 HTML。
首先,在 HTML 中包含 sweetalert2 脚本。<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
然后,编写一个创建弹出窗口的函数
function showAlert(){
Swal.fire(
'Good job!',
'You clicked the button!',
'success'
)
获取弹出元素并编辑其内部HTML
document.getElementsByClassName("swal2-popup")[0].innerHTML = "Write here your HTML for the popup.";
并结束该功能
`}`
function showAlert(){
Swal.fire(
'Good job!',
'You clicked the button!',
'success'
)
document.getElementsByClassName("swal2-popup")[0].innerHTML = "Hello, this is an alert with a <button onclick='alert()'>button</button>.";
}
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<body>
<p>Hi, this is some inutile text here.
Lorem ipsum dolor sit amet consectetur adipiscing elit praesent, maecenas felis aenean sapien vulputate sed porttitor habitasse auctor, hendrerit eros nibh ligula mollis ornare venenatis. Taciti arcu dapibus aliquam ridiculus nostra posuere velit, facilisi aenean morbi vehicula cursus nullam sapien potenti, tristique pulvinar nulla fames auctor rutrum. Faucibus torquent dui interdum quisque nisi nam maecenas duis, mauris eget class euismod integer curae ultricies, tempor sem felis varius sapien nunc cum.</p><button onclick="showAlert()">SHOW ALERT</button>
</body>
评论
chrome: