JS加载与获取远道图片

JS加载与获取远程图片

?
?
另一种方法：
HTML代码：
<span id="span">hello world</span>
?
JS代码：
var span=document.getElementById("span");
var imgEle=document.createElement("img");
span.innerHTML="图片加载中……";
var url="http://www.gdstc.gov.cn/msg/image/zwxw/201007/20100723hzc07.jpg";
function loadImage(url, callback) {
??? var img = new Image(); //创建一个Image对象，实现图片的预下载
???? img.src = url;
?? 
??? if (img.complete) { // 如果图片已经存在于浏览器缓存，直接调用回调函数
???????? callback.call(img);
??????? return; // 直接返回，不用再处理onload事件
???? }

???? img.onload = function () { //图片下载完毕时异步调用callback函数。
??? 
???????? callback.call(img);//将回调函数的this替换为Image对象
???? };
};
function imgLoaded(){
?? alert(this.width);
??? span.innerHTML="";
??? ?imgEle.src=this.src;
??? ?span.appendChild(imgEle);
}
loadImage(url,imgLoaded);