alert对img的onload的影响，求解释

Question

如以下代码window.onload=function(){
var img=new Image();
img.src="aaa.jpg";
alert(img.width+","+img.height);//加了这一句后，下面的onload里面的语句不执行了，去掉就可以
img.onload=function(){
alert("测试");
}
}如果我加上了“alert(img.width+","+img.height);”之后，“img.onload”里面的就不会执行，即弹出了图像的宽度和高度（是正确的宽高）；但是去掉“alert(img.width+","+img.height);”，“img.onload”里面的就可以执行，即弹出一个“测试”，我使用的是火狐浏览器

Answer 1

window.onload=function(){
    var img=new Image();
    img.src="aaa.jpg";
    img.onload=function(){
            alert(this.width + " , " + this.height);
    }
}

Answer 2

通常， img.onload 应该在 img.src 之前执行。

Answer 3

alert后后面的js语句没有执行，但是不会挂起图片的下载，等你点击ok后图片可能已经下载完毕了，在增加onload事件就不会执行了就如下面这样，不会执行alert    window.onload = function () {
        window.onload = function () { alert(1234)}
    }

Answer 4

开玩笑吗？原理3楼说了，2楼说得对，onland事件最好在src赋值前绑定，你不要以为绑了立刻执行而得不到高宽，那是加载完后执行，会得到宽高值的。

Answer 5

我之后去重新测试了下，如果是IE8和chrome，会alert两次，两种都能得到正确的宽高值；而在火狐情况比较复杂，第一次打开网页的时候，得不到图片的宽和高（返回0），但重新刷新或者关掉标签页再打开，则可以得到正确的宽和高（大概读取了缓存），并且只alert一次

Answer 6

把onload事件加载赋值src之前就OK了。

Answer 7

你alert的时候 整个 js的运行线程 是被卡住的后面的 语句 并没有被调用 所以  这个时候  img.onload还没有 赋值但是 img的加载是其他的线程在运行 所以仍旧在加载图片
很可能  这个时候 图片加载 完毕了 但是 alert还卡在哪里 img.onload 还没有设置回调方法之后你点掉了alert在设置 img.onload 但是 图片已经加载完了 不会在触发onload了
另外 如果图片是缓存的话 那么img可能直接就加载完毕了 看浏览器怎么缓存了