misswellhttps://blog.liuguofeng.com/wp-content/uploads/2018/09/html2canvas.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>Using an existing canvas to draw on</title>
<style>
button {
clear: both;
display: block;
}
</style>
</head>
<body>
<div><h1>这是HTML</h1>
<div id="content" style="width:200px;height:200px;background: rgba(100, 255, 255, 0.5);">
<img src='timg.jpg' style="width:100px;height:60px;">
<span>这是文字</span>
</div>
</div>
<h1>生成的图片</h1>
<canvas width="200" height="200"></canvas>
<script type="text/javascript" src="html2canvas.js"></script>
<button>点击生成图片</button>
<script type="text/javascript">
var canvas = document.querySelector("canvas");
document.querySelector("button").addEventListener("click", function() {
html2canvas(document.querySelector("#content"), {canvas: canvas}).then(function(canvas) {
console.log('Drew on the existing canvas');
});
}, false);
</script>
</body>
</html>