html5画布可以为任何dom元素提供屏幕截图吗？

我知道canvas的drawimage方法可以绘制HTMLImageElement、HtmlCanvaElement、HTMLVideoElement

但是如果我想画一个div容器的屏幕截图

---

我知道html2canvas库，但是我不太了解它的文档和it API，我认为它不够灵活。所以我想自己写一个？我怎么能做到呢？

这不是很简单。您必须递归地遍历所有子节点，确定它们的计算样式并手动绘制它们的表示

比如说

<div style="border: 1px solid red; background: blue;">foo</div>

foo

需要执行以下步骤：

• 确定

  div

  的尺寸和位置（

  getComputedStyle

  ）
• 相应地绘制一个蓝色填充的矩形
• 相应地画一个红色的矩形轮廓
• 确定计算字体样式和填充
• 添加具有该位置和样式的“foo”文本

---

这基本上就是html2canvas所做的，并且没有本地canvas API来完成它。

这不是很简单。您必须递归地遍历所有子节点，确定它们的计算样式并手动绘制它们的表示

比如说

<div style="border: 1px solid red; background: blue;">foo</div>

foo

需要执行以下步骤：

• 确定

  div

  的尺寸和位置（

  getComputedStyle

  ）
• 相应地绘制一个蓝色填充的矩形
• 相应地画一个红色的矩形轮廓
• 确定计算字体样式和填充
• 添加具有该位置和样式的“foo”文本

这基本上就是html2canvas所做的，并且没有本机canvas API来做这件事