HTML事件中的load事件


定义load事件监听的两种方法:

一是通过addEventListener,把load事件绑定到window上。

window.addEventListener('load', function() {
    console.log('window onload');
});

二是直接在body上添加onload属性。

<body onload="console.log('onload')">
</body>

  

Tips

根据DOM Level2 Events文档的描述,load事件应该在document而非window上被触发。然而由于所有的浏览器都已经实现了在window上触发load事件,为了向后兼容性的考虑,在浏览器中load事件的触发和spec上描述不一致。

 

两种定义load事件监听方式的执行顺序

如果在页面中同时添加这两种方式,谁会先被触发呢?触发点取决于何时加载注册load事件的脚本。按照HTML页面的加载顺序,如果把脚本放到head里加载,那么在window上注册的load事件会先触发,如果把脚本放到body里加载,那body上的onload事件会被先触发。

 

一般来说,任何在window上注册的事件,都可以通过在body上定义相应的事件属性来触发,这是因为在HTML里无法访问window元素。推荐的做法是尽可能的使用Javascript的方式注册事件。

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM