img标签的onerror事件

有时，img标签中的src图片，图片不存在或者加载失败时，原来的图片位置会出现一个碎片图标，影响用户体验度，如何能够改进一下呢？

可以借用img标签的onerror事件，img标签支持onerror 事件，在装载文档或图像的过程中如果发生了错误，就会触发onerror事件。可以使用一张提示错误的图片代替显示不了的图片。示例代码如下：

<img onerror="javascript:if('女'!= '女') this.src='../communication/businesscard/images/photo-boy.png'; else this.src='../communication/businesscard/images/photo-girl.png';" src="../../rest/readpictureaction/getUserPicture?isCommondto=true&userGuid=xxxxx">

当图片../../rest/readpictureaction/getUserPicture?isCommondto=true&userGuid=xxxxx不存在时，将触发 onerror事件，而 onerror 中又为该 img 根据该用户性别指定了../communication/businesscard/images/photo-boy.png或者../communication/businesscard/images/photo-girl.png图片。
也就是说本人照片存在则显示本人照片，本人照片不存在将显示 替代图片。