JavaScript 之 页面加载事件
一、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 之 页面加载事件的更多相关文章
- 从零开始学 Web 之 jQuery（一）jQuery的概念，页面加载事件
大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...
- Javascript中页面加载完成后优先执行顺序
Javascript中页面加载完成后优先执行顺序 document优先于windowwindow优先于element //document加载完成执行方法体 document.addEventList ...
- webdriver定位页面元素时使用set_page_load_time()和JavaScript停止页面加载
webdriver定位页面元素时使用set_page_load_time()和JavaScript停止页面加载 原文:https://my.oschina.net/u/2344787/blog/400 ...
- Javascript在页面加载时的执行顺序【转】
一.在HTML中嵌入Javasript的方法 直接在Javascript代码放在标记对<script>和</script>之间 由<script />标记的src属 ...
- jQuery 页面加载事件
页面加载完成有两种事件,一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件),二是onload,指示页 面包含图片等文件在内的所有元素都加载完成.(可以说:ready 在onload ...
- javascript的页面加载及性能优化(兼容IE7)
通常来说,window.onload就够用了,如果想加载多个事件,我们可以采取以下方式: window.onload = function(){ func1(); func ...
- ionic 页面加载事件及loading动画
页面加载完成事件(非刷新情况下,页面切换是不会重复触发此事件的,只在第一次进入页面时触发,需要重复触发的话请使用 $ionicView.enter 事件) angular.module('app.co ...
- javascript 实现页面加载完再显示页面
document.onreadystatechange = function () { if (document.readyState == "complete") { docum ...
- JavaScript Html页面加载完成
//一.Html页面加载完成的JS写法 //1. $(function () { alert("窗体Html页面加载完成方法一"); }); //2. $(document ...
随机推荐
- 13-cmake语法-路径设置
路径设置: 包括头文件路径.库文件路径.库文件名等 INCLUDE_DIRECTORIES 向工程添加多个特定的头文件搜索路径,路径之间用空格分隔,如果路径包含空格,可以使用双引号将它括起来,默认的行 ...
- 【java异常】redis.clients.jedis.exceptions.JedisConnectionException: Could not get a res
产生此错误的原因通常是: 一.Redis没有启动: 我自己遇到一次这样的问题.汗! 二.由于防火墙原因无法连接到Redis; 1.服务器防火墙入站规则. 2.访问Redis的应用程序所在主机的出站规则 ...
- arduino驱动步进电机
https://learn.adafruit.com/adafruit-motor-shield-v2-for-arduino/install-software 1安装库 Adafruit_Motor ...
- django -- ORM建表
前戏 ORM(Object Relational Mapping,简称ORM)模式是一种为了解决面向对象与关系数据库存在的互不匹配的现象的技术. ORM的优势: ORM解决的主要问题是对象和关系的映射 ...
- 第10组 Beta冲刺（2/4）
队名:凹凸曼 组长博客 作业博客 组员实践情况 童景霖 过去两天完成了哪些任务 文字/口头描述 编写商品主界面 展示GitHub当日代码/文档签入记录 暂无代码 接下来的计划 编写购买功能 还剩下哪些 ...
- UDF——监测指定点的物理量
Fluent版本:2019 R1 Visual Studio版本:Visual Studio 2013 其他版本应该也是适用的 算例来源于:https://confluence.cornell.edu ...
- limits.conf文件修改注意事项,限制文件描述符数和进程数
参考文章: https://blog.csdn.net/fanren224/article/details/79971359 https://www.cnblogs.com/micmouse521/p ...
- linux下ELK搭建好之后配置sentinl插件,进行邮件告警
ELK的环境搭建好之后,如何利用收集到的数据进行数据告警呢?在破解ELK之后,它本身提供一个监视器功能,配置偏向编写脚本.有一个更加方便的插件sentiel. 一.下载并安装sentinl插件 htt ...
- CentOS安装Hadoop
Hadoop的核心由3个部分组成: HDFS: Hadoop Distributed File System,分布式文件系统,hdfs还可以再细分为NameNode.SecondaryNameNode ...
- vue学习笔记01
使用vscode配置vue项目 因为之前我没有接触过vue.js,以前的网页也是用Thymeleaf或者jsp写的,这次要求用vscode写vue,感觉现在前端招聘需求量最大的也是这个技术,刚好自己也 ...