一、onload 加载事件

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

　　常用方式：

<head>
<script>

    windown.onload = function() {

      // 方法体

    }

</script>
<head>

　　 这个事件是等待页面加载完成之后，再执行 <script> 标签的内容。即页面上所有的元素创建完毕，并且引用的外部资源下载完毕（js，css，图片）

　  注意：该事件相比于在 <body> 中的 <script> 标签中的内容执行速度慢，因为 onload 需要等页面加载完毕才执行，而其他的当页面上的元素创建完毕后就会执行。

　　onload 不仅仅可以应用于 window，也可以用于其他的一些标签。

二、onunload 卸载事件

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

　　Demo：

1 onunload = function () {

2     alert('欢迎下次再来');      // 报错： Blocked alert('欢迎下次再来') during unload.

3     console.log('bye bye');

4 }

　　当我们按 F5重新加载页面会发现 alert 对话框会报错，并不会执行，这是因为 onunload 事件中所有的对话框都无法使用，window 对象被冻结了。

　　　　

JavaScript 之 页面加载事件的更多相关文章

  1. 从零开始学 Web 之 jQuery（一）jQuery的概念，页面加载事件

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  2. Javascript中页面加载完成后优先执行顺序

    Javascript中页面加载完成后优先执行顺序 document优先于windowwindow优先于element //document加载完成执行方法体 document.addEventList ...

  3. webdriver定位页面元素时使用set_page_load_time()和JavaScript停止页面加载

    webdriver定位页面元素时使用set_page_load_time()和JavaScript停止页面加载 原文:https://my.oschina.net/u/2344787/blog/400 ...

  4. Javascript在页面加载时的执行顺序【转】

    一.在HTML中嵌入Javasript的方法 直接在Javascript代码放在标记对<script>和</script>之间 由<script />标记的src属 ...

  5. jQuery 页面加载事件

    页面加载完成有两种事件,一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件),二是onload,指示页 面包含图片等文件在内的所有元素都加载完成.(可以说:ready 在onload ...

  6. javascript的页面加载及性能优化(兼容IE7)

    通常来说,window.onload就够用了,如果想加载多个事件,我们可以采取以下方式: window.onload = function(){        func1();        func ...

  7. ionic 页面加载事件及loading动画

    页面加载完成事件(非刷新情况下,页面切换是不会重复触发此事件的,只在第一次进入页面时触发,需要重复触发的话请使用 $ionicView.enter 事件) angular.module('app.co ...

  8. javascript 实现页面加载完再显示页面

    document.onreadystatechange = function () { if (document.readyState == "complete") { docum ...

  9. JavaScript Html页面加载完成

    //一.Html页面加载完成的JS写法 //1. $(function () {     alert("窗体Html页面加载完成方法一"); }); //2. $(document ...

随机推荐

  1. PassArrayByCopy_test.php

    <?php //PassArrayByCopy_test.php $a=array("a","b","c"); function te ...

  2. mybatis框架，使用foreach实现复杂结果的查询--循环List集合方式

    需求,根据用户角色列表  查询用户列表信息 之前我们传入的参数是Array,一个数组的形式,现在我们传入的是一个List集合,其他条件没有变化. /** * 需求:传入指定的用户角色,用户角色有1-n ...

  3. springmvc controller层接收List类型的参数

    Spring MVC在接收集合请求参数时,需要在Controller方法的集合参数里前添加@RequestBody,而@RequestBody默认接收的enctype (MIME编码)是applica ...

  4. 拷贝插件 copy-webpack-plugin

    用于拷贝文件或目录到输出目录中 https://blog.csdn.net/weixin_41643133/article/details/95489335 https://www.jianshu.c ...

  5. 4.28（TG模拟赛）总结

    1.挖地雷 题目背景 NOIp1996提高组第三题 题目描述 在一个地图上有N个地窖(N≤20),每个地窖中埋有一定数量的地雷.同时,给出地窖之间的连接路径.当地窖及其连接的数据给出之后,某人可以从任 ...

  6. spark基础知识三

    主要围绕spark的底层核心抽象RDD和原理进行理解.主要包括以下几个方面 RDD弹性分布式数据集的依赖关系 RDD弹性分布式数据集的lineage血统机制 RDD弹性分布式数据集的缓存机制 spar ...

  7. python总结三

    1.线性表若采用链式存储结构的时候,要求内存中可用存储单位的地址是:连续或者不连续都可以 链式存储去找后继节点或者前驱节点是使用指针来实现的,不需要连续的内存,当然,也可以是连续的内存地址 2. 线性 ...

  8. Windows彻底卸载VMWare虚拟机详细步骤

    不能卸载vmware ,原因是VMware的服务在运行中,停止服务就可以卸载了. 点击开始输入[services.msc],然后点击搜索到服务. 找到这个软件的图一的所有项,然后右键它属性. 全部设置 ...

  9. cad.net 块裁剪边界反向修剪

    Querying for XCLIP information inside AutoCAD using .NET  这里下面观众讨论了 How do I determine if an x-clip ...

  10. JSR223 PostProcessor VS BeanShell PostProcessor in JMeter

    I would recommend using JSR223 PostProcessor About performance: In JMeter's official user manual, Ab ...