html2canvas初次使用

最新推荐文章于 2025-07-11 16:09:48 发布

just_a_dream_

最新推荐文章于 2025-07-11 16:09:48 发布

阅读量2.1k

点赞数

CC 4.0 BY-SA版权

分类专栏： html5 文章标签： html2canvas

本文链接：https://blog.youkuaiyun.com/just_a_dream_/article/details/80198063

html5 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了一种使用html2canvas库将HTML元素转换为Canvas图像的方法。通过具体示例展示了如何设置HTML页面，并利用html2canvas进行截图。该过程包括初始化选项、选择目标元素及最终将生成的Canvas追加到页面中。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html>
<head>
	<title>html2canvas</title>
</head>	
<body>
	<div id="sel">
		<h1>html2canvas</h1>
		<div style="width: 100%;background: red;height: 100px;"></div>
		<img src="*******/005.jpg">	
	</div>
	<script src="html2canvas.min.js"></script>
	<script type="text/javascript">
	var opts = {useCORS: true};      //图片跨域
	html2canvas(document.querySelector("#sel"),opts).then(function(canvas) {
	    document.body.appendChild(canvas);
	});
	</script>
</body>
</html>