前端-js生成pdf文件

duangduang94

已于 2023-04-19 16:29:04 修改

阅读量9.1k

点赞数 3

文章标签：前端 js

于 2022-04-20 11:13:38 首次发布

本文链接：https://blog.csdn.net/duangduang94/article/details/124292551

版权

一、引入js插件

html2canvas.js

jspdf.debug.js

二、导出范围外层元素添加id

<div id="pdfDom"></div>

三、设置导出按钮

<a href="javascript:;" id="exportReport">导出</a>

四、JS代码相关配置

let downPdf = document.getElementById("exportReport");//点击导出事件
downPdf.onclick = function () {
    let title = '我的简历';
    let targetDom = document.querySelector('#pdfDom');
    window.pageYoffset = 0;
    document.documentElement.scrollTop = 0;
    document.body.scrollTop = 0;
    html2canvas(targetDom, {
        allowTaint: true,
        scale: 2, // 提升画面质量，但是会增加文件大小
        height: targetDom.scrollHeight, //canvas高
        width: targetDom.scrollWidth, //canvas宽,
        onrendered: function (canvas)