诊断 body.onload 未被调用答案

【问题标题】：Diagnosing body.onload not being called诊断 body.onload 未被调用
【发布时间】：2012-11-08 17:29:23
【问题描述】：

我有一些网页依赖body.onload（或等效的window.onload）来正确设置它们。有时onload 没有被调用。

某些网络浏览器（最好是 Chrome，这显然最常发生这种情况）是否有一个技巧可以告诉我究竟是什么阻止了页面加载成功？

提示：当我按 F5 重新加载整个页面时，这种情况很少（甚至可能永远不会）发生，但更普遍的是，如果通过单击链接或将 url 粘贴到地址栏中到达页面，就会发生这种情况。 onload 语义上是否有一个怪癖可能会绊倒我？

注意脚本本身不会在控制台中产生任何错误。

【问题讨论】：

“我很高兴接受“不使用加载”的解决方案，前提是我可以挂钩在 DOM 完全加载后发生的跨平台事件。” 如果您可以控制脚本标签的位置，只需将它们放在页面底部即可。

标签： javascript html dom

【解决方案1】：

我想你想要window.onload

【讨论】：

显然他们是the same event，当我进行实验时并没有解决它。我仍然需要找出页面未加载的原因。
是的onload 是同一个事件，但是将它附加到window 与body 是不相同的。也就是说，听起来你还有其他事情要做。你的 JS 控制台说什么？
如问题所述，控制台为空。

【解决方案2】：

我已经测试过这种情况，但以下方法都不起作用：

var callback = function() { alert("Body loaded"); };
$("body").load(callback);
document.body.addEventListener("load",callback,false);

但是，document.body.onload 似乎工作正常。确保 body 的命名空间正确：

document.body //<body>
body //Reference error

如果你在谈论：

<body onload="callback();"></body>

然后返回并检查您的代码，因为它应该可以工作。

个人建议使用window对象的load事件或者框架的ready事件。

//Execute when the window is loaded
var callback = function() {
     //Your code goes here...
};
if (window.addEventListener) window.addEventListener("load",callback,false);
else window.attachEvent("load",callback);

使用 jQuery，您只需要以下内容：

$(window).load(callback);

jQuery的ready事件如下：

$(document).ready(callback);
//Or just:
$(callback);

MooTools 使用这个：

window.addEvent("domready",callback);

而且不同的库都有自己的方式。

【讨论】：