一、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. Free Professional Resume Examples and Writing Tips

    https://www.thebalancecareers.com/free-resume-examples-and-writing-tips-2063596 Do you need to write ...

  2. btcWallet系列之一-grpc模块

    btcwallet对外服务 btcwallet除了像btcd对外提供rpc服务以外,还提供了grpc服务,同时grpc采用的是protobuf来实现. 这方便与不同语言进行交互,降低客户端代码编写量. ...

  3. OpenCV 学习笔记(13)图像转换成视频

    关键 1参数里的分辨率是图像本身的分辨率,而不是指定生成的视频分辨率.如果要修改分辨率,要么后期软件处理,要么读图的时候resize 2要正常退出,不要强制退出. 3生成的只能是avi格式. #inc ...

  4. 在jsp页面中通过struts的标签<s:if>来判断选择显示控件

    <s:iterator value="#request.users" var="u"> <!-- 判断该条评论的评论人是不是查看这篇评论的用户 ...

  5. ESA2GJK1DH1K升级篇: 远程升级准备工作: 安装Web服务器

    前言 大家可以安装Apache,Tomcat,nginx 等Web服务器软件,这篇文章安装 OpenResty 作为Web服务器软件,该软件安装在云端电脑,如果想 安装到自己本地电脑实现该功能,可使用 ...

  6. 请简要描述margin重复问题,及解决方式

    两个相邻的盒子垂直方向上的margin会发生重叠,取较大的那个值,而不是相加. 解决: 父级设置padding代替margin 父级设置overflow:hidden 当前元素设置透明的边框 使用绝对 ...

  7. git提交代码时出现was rejected by remote错误

    git常见问题 git是大家在公司基本都项目管理工具,有一次在改了一个bug提交远程提交就出现问题了. 解决方案 首先这个是远程提交的时候被项目权限拦截掉了,一般在我们都用配置ssh公钥的方式操作,那 ...

  8. C实现Linux中copy功能

    /* mycp.c */ #include<stdio.h> #include<stdlib.h> #include<unistd.h> #include<f ...

  9. Kaggle实战——点击率预估

    https://blog.csdn.net/chengcheng1394/article/details/78940565 原创文章,转载请注明出处: http://blog.csdn.net/che ...

  10. Android Q Beta 6 终极测试版发布!

    前言 当今手机市场可谓是百花齐放,但手机系统却屈指可数,其中Android和iOS就占据了整个手机系统市场的99%,单单Android就占据了整个手机系统市场的86%,可谓是占据绝对优势.     其 ...