JavaScript页面加载事件实例讲解
更新时间：2019年09月01日 15:55:32 作者：格物致知_Tony
在本篇文章中我们给大家通过实例讲解一下关于JavaScript页面加载事件的相关知识点内容，有需要的朋友们可以参考下。
一、onload 加载事件
onload 是 window 对象的一个事件，也可以省略 window 直接使用。
常用方式：
<head><script>
windown.onload = function() {
// 方法体
}
</script><head>
这个事件是等待页面加载完成之后，再执行 <script> 标签的内容。即页面上所有的元素创建完毕，并且引用的外部资源下载完毕（js，css，图片）
注意：该事件相比于在 <body> 中的 <script> 标签中的内容执行速度慢，因为 onload 需要等页面加载完毕才执行，而其他的当页面上的元素创建完毕后就会执行。
onload 不仅仅可以应用于 window，也可以用于其他的一些标签。
二、onunload 卸载事件
onunload 是卸载事件，当页面卸载的时候执行。
Demo：
onunload = function () {
alert('欢迎下次再来'); // 报错： Blocked alert('欢迎下次再来') during unload.
console.log('bye bye');
}
当我们按 F5重新加载页面会发现 alert 对话框会报错，并不会执行，这是因为 onunload 事件中所有的对话框都无法使用，window 对象被冻结了。
上面的知识点很简单，希望能够给大家提供到帮助同时感谢大家对脚本之家的支持。+
相关文章
详解element-ui 表单校验 Rules 配置 常用黑科技
这篇文章主要介绍了element-ui 表单校验 Rules 配置 常用黑科技，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2020-07-07
这篇文章主要为大家详细介绍了Javascript事件驱动编程的相关资料,通过经典案例向大家介绍Javascript事件驱动编程，需要的朋友可以参考下2016-01-01
下面小编就为大家带来一篇微信JS SDK接入的几点注意事项(必看篇)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-06-06
这篇文章主要为大家详细介绍了JS实现异步上传压缩图片，并立即显示图片，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-04-04
22 行 JavaScript 代码实现 QQ 群成员提取器，如果没有达到效果可能原因一是QQ版本升级了，二是博客里面的代码也有些繁琐2013-10-10
H5跳转小程序按钮不显示(wx-open-launch-weapp)踩坑指南
这篇文章主要给大家介绍了关于H5跳转小程序按钮不显示(wx-open-launch-weapp)踩坑的相关资料,文中介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2023-02-02
JavaScript 发布订阅模式（Publish/Subscribe Pattern）是一种常用的设计模式，发布订阅模式的核心思想是解耦事件的发生和事件的处理，本文将介绍 JavaScript 发布订阅模式的基本原理、应用场景以及各场景的代码示例,需要的朋友可以参考下2023-05-05
这篇文章主要为大家详细介绍了微信小程序实现留言板，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2018-11-11
这篇文章主要介绍了JS实现点击登录弹出窗口同时背景色渐变动画效果,涉及JavaScript基于鼠标事件及时间函数定时触发形成渐变动画的相关技巧,需要的朋友可以参考下2016-03-03
这篇文章主要给大家介绍了electron-builder打包exe后白屏的解决方法,文中有相关的代码示例供大家参考,具有一定的参考价值,需要的朋友可以参考下2024-01-01
最新评论