html2canvas实现dom转成图片变下载
import html2canvas from "./html2canvas.min.js";
new html2canvas(document.getElementById('cur-cert-img'),
{
allowTaint: true,
useCORS: true, // 跨域
scale: 2, // 文字清晰
dpi: 300, // 文字清晰
width: 400,
height: 300
}
).then(canvas => {
// canvas为转换后的Canvas对象
let oImg = new Image();
oImg.src = canvas.toDataURL(); // 导出图片
document.body.appendChild(oImg); // 将生成的图片添加到body
oImg.onload = () => {
const a = document.createElement("a");
a.href = oImg.src;
a.download = certObj.title;
a.click();
}
document.body.removeChild(oImg)
});
- 如果下载下来的图片, 原dom结构里的图片部分不清晰,应使用img表情,不能使用style背景图
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 记一次.NET内存居高不下排查解决与启示
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· DeepSeek 开源周回顾「GitHub 热点速览」