为什么加载事件有时会在jQuery 3.x中的ready事件之前触发？

Question

我试图理解在SO上阅读有关它的其他主题，但我找不到明确的答案。

我还检查了https://api.jquery.com/ready/和https://api.jquery.com/load-event/

当然，并非总能如此。

Load before ready（无内容）

Load after ready（带图片） - 但只是第一次访问该笔时，刷新它（或者您拥有出色的互联网连接并且您在1ms内下载1MB;） ） - 加载事件将在之前激活，因为您已在浏览器缓存中拥有该图像。

我知道如何部分“修复”这个，但我对它发生的原因更感兴趣。

Possible fix:

var windowLoaded = false;

$(function() {
  console.log('Ready'); // Good - it will always fire **before** load event
});

$(window).on('load', function() {
  windowLoaded = true;
});

$(function() {
  if(windowLoaded) { // (1)
    console.log('Loaded');
  } else {
    $(window).on('load', function() {
      console.log('Loaded');
    });
  }
});

$(function() {
  console.log('Ready'); // Bad - it will sometimes fire **after** load event - when `windowLoaded` is true in if statement (1)
});

但是这个“修复” isn't bulletproof - 请参阅代码评论