即使没有src标记，为什么Image'complete'属性总是返回true？

Question

我只是写

document.createElement("img").complete;//To check whether image is loaded or not

在Firefox中，它返回true。在IE中，它返回false

OR

在html页面中，只需创建一个图像：

 <!-- IMG tag with no SRC attribute. -->
<img id="noSrcImg" />

和在js中检查完整的属性值：

var img = document.getElementById("noSrcImg");
img.complete

对于FF为真，对于IE

为假

任何人都可以解释为什么这种不一致的行为？

还有其他更好的方法可以检查DOM中是否加载了图像吗？

我尝试使用readyState属性，但它不适用于IE11。

Answer 1

这是IE中的一个错误。 According to the spec：

  

如果满足以下任一条件，则IDL属性complete必须返回true：

     

  
• 省略src属性。
  
• 获取资源后，网络任务源排队的最终任务已排队。
  
• img元素完全可用。
  
• img元素已损坏。
  

     

否则，该属性必须返回false。

了解图像状态的最佳方法是处理load和error事件。如果由于某种原因不可行，要判断图像是否已成功加载，请检查img.complete && img.naturalWidth > 0。如果为true，则表示图像已成功加载。否则，图像仍在加载，或者无法加载 - 由于IE的不一致，很难分辨出哪一个。

Answer 2

请尝试加载

还要确保在分配src之前定义事件处理程序 - 在非常快的网络上，如果没有先定义，src可能会在事件处理程序之前加载

var im = document.createElement("img");
im.onload=function() { alert(this.src+' loaded')} // assign before src
im.onerror=function() { alert(this.src+' failed')} // if necessary
im.src="someimage.jpg";

Answer 3

像任何href一样清空img src作为相对URL指的是基本URL，即文档的URL。 @mplungjan发布了一个很好的解决方案来实际检查它是否以及何时加载

Answer 4

如果浏览器已完成获取图像（无论是否成功），则返回一个true的布尔值。如果图像没有src值，它也会显示true。