JS：如何将 HTML 元素转换为 PDF

Question

我需要将 HTML & CSS 页面下载为 PDF。当用户单击此按钮时

const btn = document.querySelector("button");

table{
  border:1px solid black;
  border-radius: 10px;
  width: 100%;
  padding: 10px;
}

<div id="pdf_content">
<center><h1>Customers</h1></center>
  <table>
    <tr>
      <td>No</td>
      <td>Name</td>
      <td>Phone</td>
    </tr>
    <tr>
      <td>01</td>
      <td>Test01</td>
      <td>+44712365478</td>
    </tr>
    
  </table>  
</div>
<br>
<button>Download PDF</button>

This

是否有任何插件或函数

Answer 1

没有简单的方法可以直接转换为 PDF。但是，您可以调用 window.print()，这将打开用户浏览器的打印对话框。大多数现代系统都预装了 PDF 打印机。

Answer 2

您可以使用 jQuery 和 jsPDF Library:

<script src="js/jquery.min.js"></script>

<script src="js/jsPDF/dist/jspdf.min.js"></script>

实例化jsPDFclass:

var doc = new jsPDF();

通过 ID 或 class 从特定元素中检索 HTML 内容。转换网页特定部分的 HTML 内容并生成 PDF。将 HTML 内容保存并下载为 PDF 文件。

JS：如何将 HTML 元素转换为 PDF

JS: How Can I Convert HTML Element Into A PDF

html

javascript

css

pdf

download