一、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. swagger 配置- ssm

    swagger 配置 - ssm swagger 是一个用来看接口的工具,具体效果如下,这里用的是swagger2 1.porm.xml <dependency> <groupId& ...

  2. struts2学习1

    struts2使用优势 自动封装参数 参数校验 结果的处理(转发|重定向) 国际化 显示等待页面 表单的防止重复提交 struts2具有更加先进的架构以及思想 使用拦截器 struts2的历史 str ...

  3. ESA2GJK1DH1K基础篇: 移植官方MQTT包,让TCP实现MQTT功能(以GPRS模块为例)

    前言 这节代码将在这一节的基础上实现 拷贝第一节测试里面的MQTT文件夹到当前工程 当前工程建个MQTT的文件夹,用于存放那个MQTT文件夹里面的内容 添加文件到里面 注意:::: 实际源码拷贝位置 ...

  4. contest3 CF994 div2 ooxxx? oooox? ooooo?

    题意 div2 C (x)(o) 在一个平面上, 给一个水平的正方形和一个\(45^.斜\)的正方形 求是否相交(共点也算), 坐标正负\(100\)以内 div2 D (x)(o) \(A,B\)两 ...

  5. SDSC 2018 day2解题报告

    目录 10.12考试总结 T1 最近公共祖先 错误原因 T2 即时战略 T3 欧皇 10.12考试总结 T1 最近公共祖先 预估得分: 100 实际得分: 20 最大得分: 100 用时:1小时10分 ...

  6. 每日一问：详细说一下 MeasureSpec.UNSPECIFIED

    详细说一下 MeasureSpec.UNSPECIFIED 前面的文章 我留下了一个疑惑,那就是到底为什么 NestedScrollView 要把子 View 的测量模式强行设置为 MeasureSp ...

  7. Linux 中【./】和【/】和【.】之间有什么区别？

    /是指根目录,就和Windows的我的电脑那个位置差不多../是指用户所在的当前目录.如下所示:[root~]# cd /etc[root etc]# pwd/etc[rootetc]# cd /[r ...

  8. TCP、UDP和HTTP区别详解

    http:是用于www浏览的一个协议.tcp:是机器之间建立连接用的到的一个协议. 1.TCP/IP是个协议组,可分为三个层次:网络层.传输层和应用层.在网络层有IP协议.ICMP协议.ARP协议.R ...

  9. WeakhashMap源码2

    public class WeakHashMapIteratorTest { @SuppressWarnings({ "rawtypes", "unchecked&quo ...

  10. jquery的Layer弹出框操作

    在layer中,我们要先获取窗口的索引,然后再进行操作. var index = parent.layer.getFrameIndex(window.name); //获取窗口索引 $("# ...