JavaScript页面加载与卸载事件详解：onload与onunload用法

onload 加载事件详解

一、onload 加载事件

onload 是 window 对象的一个事件，也可以省略 window 直接使用。

常用方式：

<head><script>
  windown.onload = function() {
   // 方法体
  }
</script><head>

此事件在页面加载完成后执行 <script> 标签内容，即所有元素创建完毕且外部资源（js、css、图片）下载完毕。

注意：该事件执行速度慢于 <body> 中的 <script> 标签，因为前者需等待页面加载完毕，后者在元素创建完毕后即执行。

onload 不仅适用于 window，也可用于其他标签。

onunload 卸载事件及注意事项

二、onunload 卸载事件

onunload 是卸载事件，当页面卸载时执行。

Demo：

onunload = function () {
   alert('欢迎下次再来');   // 报错： Blocked alert('欢迎下次再来') during unload.
  console.log('bye bye');
}

按 F5 重新加载页面时 alert 对话框会报错且不执行，因为 onunload 事件中所有对话框均不可用，window 对象被冻结。

上述知识点简单，希望能提供帮助，同时感谢大家对本站的支持。+