html2canvas 截图示例

html2canvas是一个用于将HTML元素转化为Canvas画布的JavaScript库。它可以帮助我们在浏览器端实现截图的功能。

下面是一个使用html2canvas的简单截图示例：

首先，在HTML文件中引入html2canvas的JavaScript文件，例如：

<script src="html2canvas.min.js"></script>

然后，在需要截图的元素上添加一个id，例如：

<div id="screenshot">这是要截图的内容</div>

接下来，在JavaScript中使用html2canvas来截图，例如：

html2canvas(document.getElementById("screenshot")).then(function(canvas) {
  // 创建一个隐藏的<a>标签
  var link = document.createElement('a');
  link.style.display = 'none';
  document.body.appendChild(link);

  // 将Canvas画布转化为图片数据URL
  link.href = canvas.toDataURL();
  link.download = 'screenshot.png'; // 设置下载的文件名
  link.click();

  // 移除隐藏的<a>标签
  document.body.removeChild(link);
});

这个示例中，我们首先使用getElementById方法获取到id为"screenshot"的元素。然后通过html2canvas的then方法来获取到Canvas画布对象。

接着，我们创建一个隐藏的<a>标签，将Canvas画布转化为图片数据URL，并设置下载的文件名。最后，通过click方法触发<a>标签的点击事件，实现截图文件的下载。

以上就是一个简单的html2canvas截图示例。你可以按照这个示例来实现自己想要的截图功能。