当前位置: 首页 > 知识库问答 >
问题:

前端 - html转换成pdf格式的两种方式比较?

羊昊苍
2024-04-02

背景:

项目中有需要将html下载成pdf的需求,我看项目中的实现思路是

  1. 利用html2Canvas库将html转换成图片;
  2. 利用jspdf库将canvas生成的图片转换成pdf格式。

后面发现html2pdf可以直接将html转换成pdf格式
示例代码如下

<!DOCTYPE html><html><head>  <meta charset="utf-8" />  <meta http-equiv="X-UA-Compatible" content="IE=edge" />  <title>HTML to PDF conversion</title>  <script src="./html2pdf.bundle.min.js"></script>  <script>    function createPDF () {      // get the element of ticket content.      const docElement = document.getElementById('ticket');      // select the element and save as the PDF.      html2pdf().from(docElement).save();    }  </script></head><body>  <h1 style="color:blueviolet">Jiyik Learning</h1>  <h3>JavaScript create and download pdf</h3>  <div id="ticket">    <h1>Our Ticket</h1>    <p>Ticket content here</p>  </div>  <button onclick="createPDF()">Download as PDF</button></body></html>

html2pdf下载链接:https://www.cdnpkg.com/html2pdf.js/file/html2pdf.bundle.min.js/

例如htnl2pdf好像更简洁,请问下两种方式哪种比较好?

共有2个答案

闻人修平
2024-04-02

jspdf也可以直接生成pdf文件,都差不多,用哪个都可以的

var doc = new jsPDF();var elementHTML = document.querySelector("");doc.html(elementHTML, {    callback: function(doc) {        doc.save('sample-document.pdf');    },    x: 15,    y: 15,    width: 170, // 目标PDF文档中的宽度    windowWidth: 650 // CSS像素中的窗口宽度});

之前做过批量生成的,是用puppeteer做的,我写过一个demo,输入页面的url,直接 截图

晏炳
2024-04-02

看你的需求,我觉得转 canvas 没什么必要,我以前做的都是直接让用户 cmd+p 调用打印功能,然后布局用 @media print 来写。

 类似资料:
  • 本文向大家介绍php将日期格式转换成xx天前的格式,包括了php将日期格式转换成xx天前的格式的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了php将日期格式转换成xx天前格式的方法。分享给大家供大家参考。具体如下: 这段代码可以把时间格式化成3天前,5秒前,2年前的形式 希望本文所述对大家的php程序设计有所帮助。

  • 我有以下几点: 上面的代码不起作用。以上问题还有其他解决方案吗? 格式化日期按我在哪里可以找到留档格式化日期在JavaScript?也dint为我工作。

  • 本文向大家介绍python 将html转换为pdf的几种方法,包括了python 将html转换为pdf的几种方法的使用技巧和注意事项,需要的朋友参考一下 将 HTML 网页转换为 PDF 是很多人常见的一个需求,在浏览器上,我们可以通过浏览器的“打印”功能直接将网页打印输出为 PDF。 但是如果有多个网页就不好办了。 二进制软件 网络上存在很多将 HTML 转换为 PDF 的软件和工具。比较著名

  • 本文向大家介绍powershell 将文本转换成表格的另一种可行方式,包括了powershell 将文本转换成表格的另一种可行方式的使用技巧和注意事项,需要的朋友参考一下

  • 我对一个不太通用的需求有一个通用的问题。 我必须将一个Excel文件转换成PDF格式,但必须保留Excel文件中每个单元格的所有格式。不允许更改。比如,如果一个单元格被格式化为Currence/Accounting,那么默认情况下负值会显示在圆括号中,例如(8.5),但从Java读取时,该值是-8.5。对于数字单元格,值为0,但显示为连字符(-)。类似地,对于其他格式类型,显示也会发生变化。 如有

  • 本文向大家介绍php连接MySQL的两种方式对比,包括了php连接MySQL的两种方式对比的使用技巧和注意事项,需要的朋友参考一下 记录一下PHP连接MySQL的两种方式。 先mock一下数据,可以执行一下sql。 第一种是使用PHP原生的方式去连接数据库。代码如下: 其运行结构如下: Name: harry Age: 20 Name: tony Age: 23 第二种是使用PDO的方式去连接数据