Javascript：如何延迟返回 img.complete 的值答案

【问题标题】：Javascript: How can I delay returning a value for img.completeJavascript：如何延迟返回 img.complete 的值
【发布时间】：2015-05-02 09:46:23
【问题描述】：

我已经编写了一个脚本来测试 IMG 标签中的 SVG 支持：

function SVGinIMG() {
  var SVGdata = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNzUiIGhlaWdodD0iMjc1Ij48L3N2Zz4%3D'
  var i = document.createElement('img');
  i.setAttribute('src',SVGdata);
  return i.complete;
}
window.onload = function() {
  var hasSVG = SVGinIMG();
  alert(hasSVG);
}

这是我想要的，除了当我在 WebKit 浏览器中运行脚本时，complete 属性在我第一次加载页面时不会触发；当我刷新页面时，它可以正常工作。 return 函数在 img 加载完成之前运行；最好的延迟方法是什么？

【问题讨论】：

这里有一个类似于你的脚本，可以作为灵感：my.opera.com/Fyrd/blog/svg-image-and-background-image-replacer
哈！这就是我将其视为剧本的部分灵感，但我认为它有点太复杂了。但无论如何感谢您的链接，我会更仔细地研究它。

标签： javascript svg browser-feature-detection

【解决方案1】：

我把事情弄复杂了一点；我真正需要的只是 load 事件：

function SVGDetect() {
  var testImg = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNzUiIGhlaWdodD0iMjc1Ij48L3N2Zz4%3D';
  var img = document.createElement('img')
  img.setAttribute('src',testImg);
  img.addEventListener('load',setCSS,true);
}

这会在图像加载时运行另一个函数，而对于不支持图像中 SVG 的浏览器来说，这是永远不会发生的。

【讨论】：

不太喜欢这个版本，因为它需要回调而不是仅仅返回真/假。无论如何，感谢最初的“问题”！有什么优势？