javascript - 太晚了才收到第一条帖子？与消息和加载事件相关的事件顺序

Question

当我收到 iframe 的 DOMContentLoaded 事件时，我会从父窗口向 iframe 发送一条消息:

iframe.addEventListener('DOMContentLoaded', function() {
    iframe.postMessage('blah');
});

在我的 iframe 中，我正在为 DOMContentLoaded 上的 postMessage 设置监听器:

function msgHandler(e) {
     console.log('incoming message:', e.data);
}

window.addEventListener('DOMContentLoaded', function() {
    window.addEventListener('message', msgHandler, false);
});

所以现在一切正常了。即使我在 DOMContentLoaded 中设置了消息监听器，iframe msgHandler 仍然收到 blah 消息。我很惊讶，因为我预计我应该首先在 iframe 中设置消息监听器，然后让我的父窗口发送消息。

加载事件和消息事件的事件顺序是什么？

Answer 1

父页面和 iFrame 在浏览器中的不同线程中运行。所以ready事件可以并发运行。

当 iFrame 收到来自父级的消息时，它会被添加到事件队列的后面进行处理。鉴于将在 domReady 事件之后接收到，即使设置此监听器的代码仍在要运行的队列中，这也将起作用，因为它将位于堆栈队列的更上方。