导出pdf记录-暂记

系列文章目录

提示：这里可以添加系列文章的所有文章的目录，目录需要自己手动添加
例如：第一章 Python 机器学习入门之pandas的使用

---

提示：写完文章后，目录可以自动生成，如何生成可参考右边的帮助文档

---

前言

提示：这里可以添加本文要记录的大概内容：

例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。

---

提示：以下是本篇文章正文内容，下面案例可供参考

一、pandas是什么？

示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。

二、使用步骤

1.解决打印的内容大小问题

参考
这段代码是用于动态设置HTML文档的视口尺寸和设备像素比，通常用于与html2canvas或jsPDF等库配合实现网页内容的高清截图或PDF导出。以下是逐行解析：

html.ownerDocument.defaultView.innerHeight = 936‌

作用：将HTML元素的视口高度强制设置为936像素
场景：确保截图或PDF内容的高度与预期一致，避免内容被截断

html.ownerDocument.defaultView.innerWidth = 1407‌

作用：将视口宽度强制设置为1407像素
典型用途：适配A4纸横向打印（210mm × 297mm）的像素尺寸（1mm≈3.779px）

html.ownerDocument.defaultView.devicePixelRatio = 2‌

作用：模拟2倍屏设备（Retina屏）的像素密度
必要性：防止html2canvas在高清屏上生成模糊截图

技术原理‌：

通过直接修改defaultView属性（即window对象）的视口参数，绕过浏览器默认的响应式布局
设备像素比（DPR）直接影响canvas的渲染分辨率，设为2可获得更清晰的输出

常见应用场景‌：

网页内容导出为PDF时固定页面尺寸
生成高保真截图（如电商详情页长图）
解决跨设备渲染不一致问题

注意事项‌：

需在DOM加载完成后执行
过度修改可能导致CSS媒体查询失效
部分浏览器可能限制对devicePixelRatio的修改

如需进一步优化，建议结合html2canvas的scale参数和jsPDF的addPage方法实现分页控制。