img图片不显示时设置默认图片

img标签显示图片：

<img src="url" alt="error txt" />

当图片地址错误时，就是显示error txt，为了更好的用户体验，通常我们可以设置一张默认图片，当图片地址错误时，就显示该默认图片。

img是自闭合标签，所以一般不会去考虑使用伪元素before或after，但是，经过测试，在chrome68.0.3440.75上确实可以使用的，当图片地址正确时，该标签正常显示，before或after不生效，但是当图片错误时，img标签会变成一个双闭合标签，before和after属性生效：

<img src="url"></img>

但是在ie、safari和firefox浏览器中并不支持。

为了兼容，可以使用onerror事件，当图片不存在时，会触发该事件

<img src="url" onerror="this.src=defaultUrl" />

如果使用不当，在IE内核的浏览器下会造成死循环。比如：当默认图片的url地址也加载不成功（比如网速比较慢的时候）或不存在的话，就会反复的加载，最后造成堆栈溢出错误。可以通过设置onerror事件只触发一次来解决。

<img src="url" onerror="this.src=defaultUrl;this.onerror=null" />