是否可以（通过标准 JS 或某些浏览器扩展）获取 DOM 元素的图像数据？
我正在考虑这样的用法：
- 创建一个离屏 DOM 元素
- 动态地用一些 CSS 样式的内容填充它
- 获取其图像数据
- use the image data somehow:
- 作为背景（装饰性重复文本）
- 作为项目符号图像（unicode 项目符号）
- 作为 WebGL 纹理（神奇！）
- ...
这可以做到吗？曾经有过这样的提案吗？
我能想到的唯一方法是将元素渲染到 HTML5 画布对象。这至少很难说。我通过快速谷歌搜索找到了这样一个渲染引擎，可以在以下位置找到：http://www.isogenicengine.com/2011/08/19/rendering-html-css-to-canvas/ http://www.isogenicengine.com/2011/08/19/rendering-html-css-to-canvas/
其他明显存在的包括：
- http://html2canvas.hertzen.com/ http://html2canvas.hertzen.com/
- http://ajaxian.com/archives/crazy-times-rendering-html-in-canvas http://ajaxian.com/archives/crazy-times-rendering-html-in-canvas
绘制到画布后，您可以检索数据 url，该数据可用于设置src图像和 css 的属性，以及最有可能使用以下方法的 WebGL 纹理。
var canvas = document.getElementById("mycanvas");
var img = canvas.toDataURL("image/png");
另外，如果您专门针对 Firefox，它们有一个专有功能，可以完全满足您的需求。https://developer.mozilla.org/en/Drawing_Graphics_with_Canvas#Rendering_Web_Content_Into_A_Canvas https://developer.mozilla.org/en/Drawing_Graphics_with_Canvas#Rendering_Web_Content_Into_A_Canvas
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
