使用 JavaScript 将 html 导出为 PDF

2024-02-28

我想使用 JavaScript 将 HTML 导出为 PDF,我看到了类似的库jsPDF https://parall.ax/products/jspdf and pdfMake http://pdfmake.org/playground.html,但它们非常有限。例如,没有它们我可以导出 HTML 元素,例如<hr>,使用 jsPDF 样式非常有限,我看到this https://stackoverflow.com/questions/28250810/jspdf-using-html2canvas-js-for-export-pdf-from-html-is-not-working-for-large-dat问题,但答案对我不起作用,使用 pdfMake 我无法下载 pdf,只需使用chrome http://pdfmake.org/index.html#/gettingstarted.


如果您可以从 URL 检索 HTML,您可能需要检查这个答案 https://stackoverflow.com/questions/25046187/how-to-generate-a-pdf-from-html-web-page/48608455#48608455我写的解释了如何做。

Example:

https://dhtml2pdf.herokuapp.com/api.php?url=https://www.github.com&result_type=show

在 HTML 中放置一个锚点来显示 PDF 或在 HTML 中下载它非常容易。

该锚点将显示从https://www.github.com page:

<a href="https://dhtml2pdf.herokuapp.com/api.php?url=https://www.github.com&result_type=show" target="_blank">Show PDF</a>

这个将下载它:

<a href="https://dhtml2pdf.herokuapp.com/api.php?url=https://www.github.com&result_type=download&file_name=my_pdf">Download PDF</a>

如果您想使用 JavaScript 进行尝试,您可以创建一个 HTML 按钮并在单击事件中下载 PDF。例子:

HTML:

<button type="button" id="download-pdf-button">Download the PDF</button>

JavaScript:

document.getElementById("download-pdf-button").addEventListener("click", function() {
    var link = document.createElement('a');
    link.href = 'https://dhtml2pdf.herokuapp.com/api.php?url=https://www.github.com&result_type=download';
    link.download = 'file.pdf';
    link.dispatchEvent(new MouseEvent('click'));
});

查看Github中的项目 https://github.com/Dellos7/dhtml2pdf.

希望能帮助到你。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 JavaScript 将 html 导出为 PDF 的相关文章

随机推荐