JavaScript-onerror事件:图片加载失败后不显示

最新推荐文章于 2023-06-29 19:45:00 发布

转载最新推荐文章于 2023-06-29 19:45:00 发布 · 375 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/mazey/p/6931828.html

本文介绍了一种使用JavaScript处理HTML中图片加载失败的方法。通过设置onerror事件，可以在图片加载失败时将其隐藏，确保页面展示效果不受影响。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

HTML:

<img src="http://www.mazey.net/images/upload/image/20170518/1495122198180663.gif" id="img1" onerror="hideImg1();">
<!--下面这个图加载失败但不会出现加载失败的样式-->
<img src="http://www.mazey.net/images/upload/image/20170518/1495120456257031error.png" id="img2" onerror="hideImg2();">

JavaScript:

//加载失败隐藏图片
function hideImg1(){
	document.getElementById("img1").style.display="none";
}
function hideImg2(){
	document.getElementById("img2").style.display="none";
}