html2canvas官网链接地址：https://html2canvas.hertzen.com/
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>使用canvas将页面内容生成图片</title>
<style>
img {
width: 500px;
cursor: pointer;
}
</style>
</head>
<body>
<div class="wrapper" style="background-color:red; ">
<img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1533212152031&di=f26250570f7d5f2e7895c7c13e96d61a&imgtype=0&src=http%3A%2F%2Fh.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2F267f9e2f07082838304837cfb499a9014d08f1a0.jpg"
style="cursor: pointer" onclick="wclick()"/>
</div>
<!-- 引入canvas.js插件 -->
<script src="https://html2canvas.hertzen.com/dist/html2canvas.min.js"></script>
<script>
window.onload = function () {
// click();
html2canvas(document.querySelector(".wrapper"), {
allowTaint: true,
useCORS: true,
}).then(canvas => {
console.log(canvas);
document.body.appendChild(canvas)
});
} function wclick() {
console.log("object");
}
</script>
</body>
</html>