body.onload会等待IFrame吗？

Question

我知道onload事件在触发之前等待页面资源加载 - 图像,样式表等.

但这包括页面内的IFrame吗？换句话说,是否保证所有子帧onload都会在父级之前始终触发？

另外,如果浏览器之间的行为不同,请告知我们.

Answer 1

不,它没有.如果你想做类似的事情,你需要为iframe添加一个onload处理程序.你可以用jQuery做得很好:

  <iframe src="http://digg.com"></iframe>
  <script>
    var count = $('iframe').length;
    $(function() {
      // alert('loaded'); // will show you when the regular body loads
      $('iframe').load(function() {
        count--;
        if (count == 0)
            alert('all frames loaded');
      });
    });
  </script>

这将在加载所有帧时发出警报.

看例子:

http://jsbin.com/azilo

Answer 2

或普通的JavaScript应该工作..

function checkIframes() {
   if(!i) { i = 0; }
   if(document.getElementsByTagName('iframe')[i]) {
      document.getElementsByTagName('iframe')[i].onload = function () { i++; checkIframes(); }
   }
   else { yourFunctionInHere(); }
}

没有真正测试过这个,但应该工作...而不是参考它 document.onload = function() { checkIframes(); }

我真的不喜欢像jQuery这样的库,因为到目前为止,我发现使用常规的javascript可以用更少的代码实现更多.

Answer 3

正如我在页面上看到的，每个 iframe 都有独立的加载，并且顶部框架加载不会等待 iframe 触发。

我的网站上有 gif/png 横幅，有时加载速度非常慢，因此我将它们放入 iframe 中，这使得整个网站和 onload 事件运行得更快。