iframe 内容加载和 onload 事件答案

【问题标题】：Iframe content loading and onload eventiframe 内容加载和 onload 事件
【发布时间】：2017-08-29 14:20:48
【问题描述】：

有以下代码

<iframe id="myframe" src="..."></iframe>

<script>
document.getElementById('myframe').onload = function() {
  alert('myframe is loaded');
};
</script>

iframe 内容是由一个额外的线程加载的，因此可能存在竞争条件，我说得对吗？ iframe 内容是否会在脚本中的事件处理程序（在主线程中运行）之前加载，从而导致 alert 更新显示？

【问题讨论】：

不，你说的不对。为什么你会认为它是这样工作的？你研究过吗？您在top 中获得了一个 JS 执行线程。在加载iframe（以及链接的 JS 文件、CSS、图像等其他内容）后，父页面的加载事件会触发。参见 JS Fiddle：jsfiddle.net/66xe7j1z
Exactly when does an IFRAME onload event fire?的可能重复
那么是否保证脚本总是在 iframe 加载事件发生之前执行？
它的写法是的。如果脚本稍后被触发（例如在顶部文档的加载事件中，它等待所有其他加载完成），那么它不会。但是您提出问题的事实让我想知道为什么..您遇到了这个问题，您在此处发布的示例是否真的代表了您正在解决的问题？
@nothingisnecessary 我没有任何问题，只是想知道它是如何工作的。不幸的是，我仍然有一些疑问。 iframe 内容不是在单独的线程中加载的吗？

标签： javascript html iframe onload

【解决方案1】：

  

  function iframeDidLoad(){
       alert("Hello World");
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<iframe id="myiframe" src="#" onLoad="iframeDidLoad();"></iframe>

【讨论】：