HTML 如何添加一个按钮来打印一个HTML网页
在你的HTML网页上添加一个 “打印 “按钮,当点击时,就会打印整个网页。这是一个相当简单的功能,可以使用一些HTML元素和普通的JavaScript来添加在网页中。
因此,让我们讨论一下这样做的方法。
方法
- 首先,在HTML域中添加一个
<input />
标签。 -
将其类型属性指定为 “按钮”,并给它一些值。
-
然后为输入指定一个 “onclick “处理程序,该处理程序将使用JavaScript来处理。
-
处理输入标签的点击事件的函数将看起来像这样
const handlePrint = () => {
window.print();
}
这种方法的完整代码将是–
例子
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>
Adding Print Button
</title>
</head>
<body style="color: black;">
<h1>Hello World!</h1>
<p>Welcome to my Website</p>
<p>
This website is built using plain JS and HTML.
</p>
<p>
Okay Bye!!!
</p>
<input value='Print' type='button' onclick='handlePrint()' />
<script type="text/javascript">
const handlePrint = () => {
var actContents = document.body.innerHTML;
document.body.innerHTML = actContents;
window.print();
}
</script>
</body>
</html>