哪个更受支持:window.onload还是document.onload?


当前回答

window.onload和onunload是document.body.onload和document.body_onload的快捷方式

所有html标记上的document.onload和onload处理程序似乎是保留的,但从未触发

文档中的“onload”->true

其他回答

然而,Window.onload是标准的——PS3中的web浏览器(基于Netfront)不支持窗口对象,因此您不能在那里使用它。

然而,它们通常是相同的。类似地,body.onload在IE中变为window.onload。

简言之

IE 6-8不支持window.onload任何现代浏览器都不支持document.onload(从不触发事件)

window.onload=()=>console.log('window.onlload-works');//解雇document.onload=()=>console.log(“document.onlload-works”);//未点火

window.onload和onunload是document.body.onload和document.body_onload的快捷方式

所有html标记上的document.onload和onload处理程序似乎是保留的,但从未触发

文档中的“onload”->true

一般的想法是,window.onload在文档的窗口准备好显示时启动,document.onloade在DOM树(由文档中的标记代码构建)完成时启动。

理想情况下,订阅DOM树事件允许通过Javascript进行屏幕外操作,几乎不会产生CPU负载。相反,当多个外部资源尚未被请求、解析和加载时,window.onload可能需要一段时间才能启动。

►测试场景:

要观察差异以及您选择的浏览器如何实现上述事件处理程序,只需在文档的-<body>-标记中插入以下代码。

<script language="javascript">
window.tdiff = []; fred = function(a,b){return a-b;};
window.document.onload = function(e){ 
    console.log("document.onload", e, Date.now() ,window.tdiff,  
    (window.tdiff[0] = Date.now()) && window.tdiff.reduce(fred) ); 
}
window.onload = function(e){ 
    console.log("window.onload", e, Date.now() ,window.tdiff, 
    (window.tdiff[1] = Date.now()) && window.tdiff.reduce(fred) ); 
}
</script>

►结果:

以下是Chrome v20(可能是大多数当前浏览器)的可见行为。

没有文档。卸载事件。当在<body>中声明时,onload会触发两次,当在<head>中声明(此时事件充当document.onload)时会触发一次。根据计数器的状态进行计数和操作允许模拟两种事件行为。或者在HTML-<head>元素的范围内声明window.onload事件处理程序。

►示例项目:

上面的代码取自这个项目的代码库(index.html和keyboarder.js)。


有关窗口对象的事件处理程序列表,请参阅MDN文档。