javascript - 只需更改外部JS文件的代码即可检测div内的iframe是否被加载

Question

<div id="mydiv"> 
<iframe>
</iframe>
</div>

我想在 mydiv 的内容完全加载时发出警报消息。这应该从外部 JS 文件:javascript.js 执行，并且不对 html 页面本身进行任何更改。 (所以不能使用onload())。

谢谢。

Answer 1

1. 通过id获取div元素
2. 使用 getElementsByTagName("iframe") 获取 div 中的 iframe
3. 使用addEventListener监听iframe的load事件。在下面的示例中，我展示了如何为 load 事件处理程序使用可重用函数，并注意 e 参数可用于让您访问该事件详细信息，包括e.target

function doLoad(e) {
  alert("iframe is loaded.");
}
var the_div = document.getElementById('mydiv');
var the_iframe = the_div.getElementsByTagName("iframe")[0];
the_iframe.addEventListener("load", doLoad);
the_iframe.src = "/"; // replace '/' with page you want to load

<div id="mydiv">
  <iframe>
  </iframe>
</div>