更多相关学习资料参见http://www.pdfdownload.cn/b/ba_index.php
在本文中，我们将了解如何在浏览器（即完全在客户端）中生成任何 HTML 元素的 PDF。
我们将使用该包html2pdf生成 PDF。
html2pdf是使用html2canvas的HTML元素转换为画布，然后进入图像。然后它在 的帮助下生成图像的 PDF jsPDF。
要了解更多信息，请查看这里。
让我们看看包的一个小实现html2pdf。
一个基本的 HTML 页面，其中包含包的捆绑链接。
创建了一个简单内容的 div 块和一个导出 PDF 按钮。我们将生成一个 div 的 PDF，其 id 是view单击导出 PDF 按钮。
<!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>HTML2PDF</title>
<script src="https://raw.githack.com/eKoopmans/html2pdf/master/dist/html2pdf.bundle.js" defer></script>
<script src="./script.js" defer></script>
</head>
<body onload="main()" align="center">
<div id="view" align="center">
<h1>Export PDF</h1>
<h3>Using HTML2PDF</h3>
</div>
<button id="export-pdf">Export PDF</button>
</body>
</html>
包含 main 方法的 JavaScript 文件，一旦站点加载并侦听onclick导出 PDF 按钮上的事件，就会调用该方法。
单击导出 PDF 按钮时，html2pdf将调用该方法，该方法将元素 (div) 的引用作为其参数。
function main() {
var view = document.getElementById("view");
var exportPDF = document.getElementById("export-pdf");
exportPDF.onclick = (e) => html2pdf(view);
}
单击按钮后，将生成 PDF 并直接下载到您的系统。
我们还可以在html2pdf方法中传递一些配置选项来处理图像类型、质量、文件名等。要了解更多信息，请查看这里。
注意：基于图像的 PDF 是不可搜索的。
原文：https://www.cnblogs.com/scanp002/p/14852729.html