图片加载失败显示默认图片
背景
在写html时不想通过js、jstl表达式等去判断url是否为null,url的图片是否存在等情况,可以使用onerror。img的alt属性只是给图片设置未加载时的文字提示信息,而onerror则是给图片设置未加载时的默认图片。
隐藏图片
图片元素隐藏
<img src="http://IMG_URL" alt="图片文字提示" onerror="this.style.display='none'"/>
设置默认图
<img src="http://IMG_URL" alt="图片文字提示" onerror="this.src='默认图片的url地址';this.οnerrοr=null"/>
当onerror中设置的图片路径也不存在时就会导致浏览器一直加载这个图,造成堆栈溢出错误。所以,通常在后面加上 this.οnerrοr=null; 保证onerror里的事件只执行一次。
一个模板引擎handlebarsjs
接手维护的一个项目里用了一个叫handlebarsjs的语义模板库,通过对view和data的分离来快速构建Web模板。
https://handlebarsjs.com/guide/
如果这篇文章对你有用,可以关注本人微信公众号获取更多ヽ(^ω^)ノ ~
![微信公众号二维码](https://images.cnblogs.com/cnblogs_com/aeolian/1679458/o_wechat_gzh_qrcode.jpg)