Javascript的img onerror事件

在网页开发中，图片是一个重要的组成部分。但有时，由于网速等原因，可能会出现加载图片失败的情况。为了解决这个问题，Javascript提供了img元素的onerror事件。

什么是img onerror事件

当图片加载失败后，会触发img元素的onerror事件。我们可以通过监听这个事件来对加载失败的情况进行处理，比如展示默认图片、提示用户等。

如何使用img onerror事件

代码示例：

<img src="http://example.com/images/image.png" onerror="this.src='http://example.com/images/default.png';">

当图片加载失败时，会自动替换为默认图片：http://example.com/images/default.png。

我们也可以将事件绑定在Javascript中：

var img = document.getElementById('my-img');
img.onerror = function(){
  this.src = 'http://example.com/images/default.png';
};

img onerror事件的兼容性

img onerror事件在所有主流浏览器中都得到了支持，但在一些较老的浏览器中可能有兼容性问题。我们可以通过使用try-catch将这个事件进行兼容处理：

var img = document.getElementById('my-img');
img.onerror = function(){
  try {
    this.src = 'http://example.com/images/default.png';
  } catch(e) {}
};

结语

JavaScript的img onerror事件能够帮助我们更好地处理图片加载失败的情况，提高用户体验。在实际开发中，我们要根据项目需求合理运用。