在前端开发中，有时需要将 HTML 页面保存为 PDF 格式，便于用户下载、打印或分享。那么，是否可以使用 JavaScript 或 jQuery 实现这一功能呢？答案是肯定的。
方案一：使用第三方库
有很多第三方库可以实现将 HTML 页面转换为 PDF 格式，如 jsPDF、html2pdf、pdfmake 等。其中，jsPDF 是一个比较流行的解决方案，它提供了将 HTML 元素转换为 PDF 文档的方法。
具体实现步骤如下：
- 引入 jsPDF 库
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.4.0/jspdf.umd.min.js"></script>
- 创建一个空白的 PDF 文档对象
const doc = new jsPDF();
- 使用 addHTML 方法将 HTML 元素添加到文档中
doc.addHTML(document.body, function() {
// 将文档保存为 PDF
doc.save('document.pdf');
});示例代码如下：
-- -------------------- ---- -------
------
------
------- -----------------------------------------------------------------------------------
-------
------
----- ---- ----- --------
--------------
------- ----------------------- ------------
--------
-------- --------- -
----- --- - --- --------
-------------------------- ---------- -
-------------------------
---
-
---------
-------
-------方案二：使用浏览器原生 API
在最新的浏览器版本中，已经支持了将 HTML 页面保存为 PDF 的功能。可以使用浏览器原生的 window.print() 方法实现。
具体实现步骤如下：
- 打开 HTML 页面
- 使用
window.print()方法打印页面 - 在打印对话框中选择保存为 PDF 格式
示例代码如下：
-- -------------------- ---- -------
------
------
-------- ---- ----- -----------
-------
------
----- ---- ----- --------
--------------
------- --------------------- ------------
--------
-------- ------- -
---------------
-
---------
-------
-------需要注意的是，使用这种方式保存的 PDF 文件可能会因为浏览器和操作系统的不同而有所差异。
总结
以上两种方法都可以将 HTML 页面保存为 PDF 格式，但是第一种方案需要引入第三方库，而第二种方案则依赖于浏览器的支持。根据实际需求选择其中一种即可。
同时，需要注意的是，生成的 PDF 文件可能与原始 HTML 页面有所不同，需要进行一定的排版和美化工作。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/15050