canvas实例 扫地僧 北邮 web 前端课程之 Canvas 画布(10)

我 们 可 以 通 过 document.images 集 合 、 document.getElementsByTagName 方法又或者 document.getElementById 方法来获取页面内的图片（如果已知图片元素的 ID。

2.引用 canvas 元素

和引用页面内的图片类似地，用 document.getElementsByTagName 或

document.getElementById 方法来获取其它 canvas 元素。但你引入的应该是已经准备好的 canvas。一个常用的应用就是为另一个大的 canvas 做缩略图。

3．创建图像

我们可以用脚本创建一个新的 Image 对象，但这种方法的主要缺点是如果不希望脚本因为等待图片装置而暂停，还得需要突破预装载。

var img = new Image(); // 创建一个实例化图像对象 img.src = 'myImage.png'; // 设置对象的路径

当脚本执行后，图片开始装载。若调用 drawImage 时，图片没装载完，脚本会等待直至装载完毕。如果不希望这样，可以使用 事件：

var img = new Image(); // 创建一个实例化图像对象 img. = function(){

// 执行 drawImage 语句

}

img.src = 'myImage.png'; // 设置对象的路径

如果你只用到一张图片的话，这已经够了。但一旦需要不止一张图片，那就需要更加复杂的处理方法，但图片预装载策略超出本规范的范围。

本文来自电脑杂谈，转载请注明本文网址：
http://www.pc-fly.com/a/jisuanjixue/article-64819-10.html