img標籤的onerror事件

有時，img標籤中的src圖片加載失敗，原來的圖片位置會出現一個碎片圖標，用戶體驗會下降。
通過百度，可以給img標籤加背景圖片，代碼如下：

.headLogo img{
    display: block;
    width: 270px;
    height: 60px;
    background: url(../images/logo.png) no-repeat 0 0;
    margin: 25px 0;
 }

同時我們想去除載入圖片失敗時顯示在左上角的碎片圖標，這個要借用img標籤的onerror事件和javascript，img標籤支持onerror 事件，在裝載文檔或圖像的過程中如果發生了錯誤，就會觸發onerror事件。可以使用一張提示錯誤的圖片代替顯示不了的圖片。代碼如下：

<img src="images/logo.png" onerror="javascript:this.src='images/logoError.png';">

當圖片不存在時，將觸發 onerror，而 onerror 中又爲 img 指定一個logoError.png 圖片。也就是說圖片存在則顯示logo.png，圖片不存在將顯示 logoError.png。
但問題來了，如果logoError.png 也不存在，則繼續觸發 onerror，導致循環，故會出現打開網頁時提示 Stack overflow at line: 0錯誤。特別說明：如果圖片存在，但網絡很不通暢，也可能觸發 onerror。
解決方法：
第一種：去掉 onerror 代碼；或者更改 onerror 代碼爲其它；或者確保 onerror 中的圖片足夠小，並且容易加載而存在。
第二種：控制它不循環，代碼如下：

<script type="text/javascript"> 

function nofind(){ 
var img=event.srcElement; 
img.src="images/logoError.png"; 
img.onerror=null; 控制不要一直跳動 
} 

</script> 

<img src="images/logo.png" onerror="nofind();" />