JavaScript:失败的图像请求是否有error属性

JavaScript: Is there an error property for failed image requests?

本文关键字：是否 error 属性 请求 图像 失败 JavaScript      更新时间：2023-09-26

HTML <img>元素有一个布尔complete属性，如果图像已成功加载（或尚未分配src），则该属性为true。它还有一个onload事件，当映像成功加载时激发；还有一个onerror事件，当图像加载失败时激发（例如，由于链接断开、映像损坏或网络脱机）。

现在。。。我想知道的是，图像元素上是否存在属性，该属性表示图像已经加载失败。假设我不能使用onerror事件，因为脚本可能只有在事件触发后才能访问映像。我们正在寻找的是一个简单的布尔查找属性，如complete，它表示"已经尝试加载此图像，但失败了"。（我在规格中没有看到，但我想知道我是否遗漏了什么）。

您可以在几乎所有浏览器中使用naturalWidth和naturalHeight来获得类似的效果（IE8及以下版本不支持此属性）。naturalXX属性包含图像的原始高度/宽度，然后通过HTML/CSS属性/样式进行修改。因此，如果naturalWidth == 0，则表示图像加载失败。

（请注意，不能使用标准的width或height属性，因为它们将返回未找到的占位符图像的大小。）

document.getElementById("image").naturalWidth ? "success" : "fail"

如果你只是想更改未找到的占位符图像，有一个漂亮的HTML解决方案：

<object data="https://stackoverflow.com/does-not-exist.png">
  <img src="https://stackoverflow.com/content/img/so/logo.png">
</object>

小提琴：http://jsfiddle.net/K3dwX/1/

PS:IE6+的潜在解决方案

相关文章：