在某些父DOM元素上使用capturing事件侦听器，如**document、document.body或其他需要观察的图像 Package 器。您可以在element的addEventListener方法的第三个参数**中执行此操作：

document.body.addEventListener(
    'load',
    function(event){
        var tgt = event.target;
        if( tgt.tagName == 'IMG'){
            tgt.style.display = 'inline';
        }
    },
    true // <-- useCapture (or options object)
);

第三个参数可以是boolean（true），也可以是新添加的具有capture boolean属性（{ capture: true }）的“options”对象。
使用这种方法，在遍历document.images live HTMLCollection或某些（重新）查询的静态NodeList时，不必（重新）附加事件处理程序。
这通常被称为“事件委托模式”。
它也适用于动态插入的图像。
这也适用于image's error loading events.
addEventListener at MDN

load/onload事件不会冒泡（reference，参考），因此您所要求的是不可能的。您必须将事件处理程序附加到每个映像节点，或者在捕获阶段拦截事件，如其他答案中所建议的那样。

Array.prototype.forEach.call(document.querySelectorAll('img'), function (elem) {
    elem.addEventListener('load', function () {
        this.style.display = 'inline';
    });
    if (elem.complete) {
        elem.style.display = 'inline';
    }
});

如果图像已经被偶然加载，则“加载”事件将不会触发;因此，我们检查complete是否已经被设置。

您可以使用Image.onload事件处理程序，但不涉及冒泡。

var i = new Image;
i.onload = function() {
  this.style.display = 'block';
}

由于load事件不会冒泡，因此您可以启动自己的冒泡事件。jQuery的一个例子：

<img src="dog.jpg" onload="$(this).trigger('image-loaded')" />

$('img').on('load', function() {
    $(this).show()
})

没有图书馆：

window.onload = function() {
   var imgs = document.querySelectorAll('img')
   imgs.onload = function() {
      this.style.display = 'inline';
   }
}