Javascript判断图片加载是否成功的方法

在作页面的时候,常常碰到要在页面加载彻底以后再去展示。这时候咱们会直接想到使用window.onload的方式,或者是采用Jquery的ready方法判断,这在必定程度能够搞定。

window.onload方式

  

Jquery的ready方法

 

可是上面的方法只能判断Dom的加载状态,不能判断图片是否加载成功。若是碰到页面须要图片加载完成才能展示的状况,咱们就没法搞定了。现提供两种方式判断图片是否加载完成。

使用onload的图片加载事件检测

这里是使用onload和onerror检测判断,可是有时候不能检测到图片是否加载完成,再使用过程当中,我发现它只是判断全部图片开始加载时就触发了,不过基本能够知足需求。

使用complete的图片属性检测

这里咱们采用定时器不断检测图片的complete属性,这个比较完美,只有图片确实加载完成时,才会变成真,因此比较可靠,建议采用。