js之onload事件的一点使用心得


Posted in Javascript onAugust 14, 2013

如果我问你window.load和window.onload分别是什么意思,恐怕你会回答我:“这不是页面加载完就执行吗”。
但是答案是不一定,得看你怎么用。看一下例子吧
例1:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<html> 
<head> 
<title>Untitled</title> 
<script type="text/javascript"> 
function ShowMessage() 
{ 
alert("true"); 
} 
window.onload=ShowMessage(); 
</script> 
</head> 
<body> 
当你看到true时看不到我 
</body> 
</html>

当你看到true的弹出框的时候,你肯定没有看到“当你看到true时看不到我”,说明页面还没有载入完就已经开始执行js了。
例2
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<html> 
<head> 
<title>Untitled</title> 
<script type="text/javascript"> 
function ShowMessage() 
{ 
alert("true"); 
} 
window.onload=function(){ShowMessage();} 
</script> 
</head> 
<body> 
你看到true时就看到我了 
</body> 
</html>

当你看到true的弹出框的时候,你也会看到“你看到true时就看到我了”,这个才是真正的页面载入完才触发。
PS:推荐像onload事件之类的使用匿名函数执行,即window.onload=function(){ShowMessage();}这种形式。
Javascript 相关文章推荐
jQuery数组处理方法汇总
Jun 20 Javascript
浅析js封装和作用域
Jul 09 Javascript
Javascript 按位与运算符 (&amp;)使用介绍
Feb 04 Javascript
JavaScript中具名函数的多种调用方式总结
Nov 08 Javascript
node.js中的fs.mkdir方法使用说明
Dec 17 Javascript
bing Map 在vue项目中的使用详解
Apr 09 Javascript
JavaScript常见事件处理程序实例总结
Jan 05 Javascript
Django+vue跨域问题解决的详细步骤
Jan 20 Javascript
Vue的编码技巧与规范使用详解
Aug 28 Javascript
微信小程序wx.request的简单封装
Nov 13 Javascript
JavaScript实现简单拖拽效果
Sep 15 Javascript
在 HTML 页面中使用 React的场景分析
Jan 18 Javascript
jQuery Animation实现CSS3动画示例介绍
Aug 14 #Javascript
JavaScript中json使用自己总结
Aug 13 #Javascript
jquery自定义类似$.ajax()的方法实现代码
Aug 13 #Javascript
Jquery动态进行图片缩略的原理及实现
Aug 13 #Javascript
javascript中RegExp保留小数点后几位数的方法分享
Aug 13 #Javascript
js Select下拉列表框进行多选、移除、交换内容的具体实现方法
Aug 13 #Javascript
jquery二级导航内容均分的原理及实现
Aug 13 #Javascript
You might like
使用sockets:从新闻组中获取文章(二)
2006/10/09 PHP
php fsockopen伪造post与get方法的详解
2013/06/14 PHP
php中的curl使用入门教程和常见用法实例
2014/04/10 PHP
Yii不依赖Model的表单生成器用法实例
2014/12/04 PHP
php上传文件并显示上传进度的方法
2015/03/24 PHP
PHP使用HTML5 FileApi实现Ajax上传文件功能示例
2019/07/01 PHP
js对列表中第一个值处理与jsp页面对列表中第一个值处理的区别详解
2013/11/05 Javascript
TypeScript具有的几个不同特质
2015/04/07 Javascript
javascript制作幻灯片(360度全景图片)
2015/07/28 Javascript
js老生常谈之this,constructor ,prototype全面解析
2016/04/05 Javascript
Angular Module声明和获取重载实例代码
2016/09/14 Javascript
js实现的光标位置工具函数示例
2016/10/03 Javascript
NodeJS学习笔记之Module的简介
2017/03/24 NodeJs
javascript帧动画(实例讲解)
2017/09/02 Javascript
详解nuxt sass全局变量(公共scss解决方案)
2018/06/27 Javascript
浅谈TypeScript 用 Webpack/ts-node 运行的配置记录
2019/10/11 Javascript
JavaScript数组及常见操作方法小结
2019/11/13 Javascript
JS中的继承操作实例总结
2020/06/06 Javascript
用Python制作简单的钢琴程序的教程
2015/04/01 Python
Python(TensorFlow框架)实现手写数字识别系统的方法
2018/05/29 Python
详解Django 中是否使用时区的区别
2018/06/14 Python
基于腾讯云服务器部署微信小程序后台服务(Python+Django)
2019/05/08 Python
Python如何将函数值赋给变量
2020/04/28 Python
Python中使用threading.Event协调线程的运行详解
2020/05/02 Python
解决python3.6用cx_Oracle库连接Oracle的问题
2020/12/07 Python
巴西宠物商店:Cobasi
2019/04/19 全球购物
护理自荐信
2013/10/22 职场文书
初中物理教学反思
2014/01/14 职场文书
通信生自我鉴定
2014/01/18 职场文书
教师求职信范文
2014/05/24 职场文书
初中生庆国庆演讲稿范文2014
2014/09/25 职场文书
2014年小学德育工作总结
2014/12/05 职场文书
治庸问责工作总结
2015/08/11 职场文书
给校长的建议书作文400字
2015/09/14 职场文书
2021年pycharm的最新安装教程及基本使用图文详解
2021/04/03 Python
springboot使用Redis作缓存使用入门教程
2021/07/25 Redis