Javascript预加载-加载不一致

Question

之间有什么区别

<img id="el" src="HD.jpg" onload="loadImage();">
function loadImage() {...}

和

<img id="el" src="HD.jpg">
document.getElementById('el').onload=loadImage();

？

示例1在图像完全加载时触发该函数，而示例2甚至在图像的第一位加载之前触发该函数。 是不是应该是同一回事？

全速互联网访问很难发现差异，而窄速互联网则明显。

注意

document.getElementById('el').src.onload=loadImage();

也不起作用。

谢谢

编辑：对近似的职位感到抱歉，不要犹豫，建议一个合适的职位。

Answer 1

您所做的事情与您认为的工作完全不同：您将loadImage返回的值分配给img元素的..onload成员。

实际发生的情况是，在脚本加载时，它会分配调用loadImage()函数的结果（这就是为什么您看到它在任何图像之前运行的原因）的原因，这很可能在img.onload处理函数中undefined ，因此将其禁用。

要执行所需的操作，您需要为img.onload处理函数分配一个函数 -例如，只需包装另一个函数即可：

document.getElementById('el').src.onload = function() { loadImage(); };

或者您可以直接将您的函数分配为处理程序。 它很好地说明了为什么它以前不起作用，尽管我不建议这样做：

document.getElementById('el').src.onload = loadImage;

（请注意缺少() ）