javascript - 访问 <img> 标签数据

Question

我想访问标签数据，以便在使用 Javascript 图像处理库处理后将此图像发送到服务器(数据库)。

Answer 1

这可以通过 HTML5 的 <canvas> 来完成:

对于 IE 中的 Canvas 支持:http://me.eae.net/projects/iecanvas/

• 创建 Canvas :
  var canvas = document.createElement('CANVAS'); canvas.setAttribute('width',150);<br/> canvas.setAttribute('height',150);

• 获取二维上下文:
  var context = canvas.getContext('2d');

• 将图像复制到 Canvas 中:
  context.drawImage(document.getElementById('your_image_id'),0,0);

• 随意修改:https://developer.mozilla.org/en/Canvas_tutorial

• 获取数据 URL:
  canvas.toDataURL()

就是这样。

此外，请查看:http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html