用javascript判断图片是否加载的3种方法

有时,在前端开发的工作,我们需要在图片加载图片的信息,这样我们可以得到大小和图片大小正确,并执行相应的回调函数,使画面产生一定的显示效果。本文主要收集了几种常见的Javascript判断图片加载完成的方法,并说明与解释结合规范和实际应用。

OnLoad方法

添加onload属性IMG标签和填写相应的函数来执行后续的Javascript代码。在下面的代码示例中,此元素是默认不显示的,和图像显示在负载完成onload。

复制代码代码如下所示:







函数获取(TS){

ts.style.display =阻止'; / /显示图片

}





优点:您可以将Javascript代码部分加载到页面的任何部分,并可用于任意任意的图片。

缺点:你必须高度onlaod属性对每个标签,不适用的情况下,HTML代码不能直接操纵,或如果减少代码。

Javascript的本地方法

选择指定的身份证照片,指定回调方法通过onload事件,和加载的图片后,图片加载完成完成完成单词提示。

复制代码代码如下所示:







document.getelementbyid(道)。指针函数(){

警报(图像加载已完成);

}





优点:简单易用,不影响html代码。

缺点:只有一个元素可以指定,和Javascript代码必须放置在画面元素

jQuery的方法

对每一类图像元素相互结合的活动,通过加载jQuery方法,元素将淡出。

注意,不要将加载事件绑定到$(文档)Ready()中。

复制代码代码如下所示:



$(函数(){())

$('。PIC1)。每个(函数(){)

$(.)

$(这)FadeIn();

});

});

})





优点:可以在批处理中绑定元素事件,不影响HTML代码的内容。

缺点:需要jQuery库的支持,代码需要放在所需的操作元素下面。