javascript学习—理解addLoadEvent函数
onload事件是HTML DOM Event 对象的一个属性，又叫事件句柄（Event Handlers），它会在页面或图像加载完成后（注意是加载完成后）立即发生。
window.onload = func的作用就是在页面加载完成后将func函数绑定到onload事件上并执行。如果页面加载完成之后，只需要执行一个函数func，那么只用window.onload = func也就可以了，但是如果需要执行两个甚至多个函数呢？
直接调用两次onload不就行了:
window.onload=firstfunction;
window.onload=secondfunction;
这么做的话，只有secondfunction会被绑定，因为前面的值被后面的值覆盖了。那么该怎么办？
将两个函数合并到一个函数当中不就行了，匿名函数发挥作用的时候到了：
window.onload = function() {
fristfunction;
secondfunction;
}
不过，它也只能绑定两个函数。还好，大神们早已解决了这个问题。西蒙·威利森 (Simon Willison)——jQuery框架的开发者之一编写了下面的addLoadEvent函数：
function addLoadEvent(func) {
var oldonload = window.onload;//将现有的事件处理函数的值存入变量中
if (typeof window.onload != 'function') {
window.onload = func;//如果这个事件处理函数没有绑定任何函数，就把新函数添加给它
} else {
window.onload = function() {
oldonload();
func();//如果已经绑定了函数，就把新函数追加到现有指令的末尾
}
}
}
然后，不管页面加载完成后要执行多少个函数，只要调用这个函数就可以了：
addLoadEvent(firstfunction);
addLoadEvent(secondfunction);
addLoadEvent(thirdfunction);
...
附：相关概念
1 支持onload事件的 HTML 标签有<body>, <frame>, <frameset>, <iframe>, <img>, <link>, <script>
支持该事件的 JavaScript 对象有image（图像）, layer, window（整个页面）
2 事件句柄（Event Handlers），可以在某个事件发生时通过一个事件句柄对某个元素进行操作。
事件是可以被控件识别的操作，如按下确定按钮，选择某个单选按钮或者复选框。每一种控件有自己可以识别的事件，如窗体的加载、单击、双击等事件，编辑框（文本框）的文本改变事件，等等。
3 HTML DOM Event 对象代表事件的状态，比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态等。事件通常与函数结合使用，函数不会在事件发生前被执行（这句很重要）。
参考资料：
JavaScript DOM编程艺术 by Jeremy Keith
HTML DOM Event 对象
事件
javascript学习—理解addLoadEvent函数的更多相关文章
- JavaScript学习03 JS函数
JavaScript学习03 JS函数 函数就是包裹在花括号中的代码块,前面使用了关键词function: function functionName() { 这里是要执行的代码 } 函数参数 函数的 ...
- javascript学习总结之函数
前言 在学习javascript函数的时候,有几个经常很容易混淆的方法,call,apply,bind,caller,callee,这些方法的使用,这些也可以说是会频繁使用的一些方法,在此通过查阅相关 ...
- 廖雪峰 JavaScript 学习笔记（函数）
JavaScript中,定义函数的方式如下: function abs(x) { if (x >= 0) { return x; } else { return -x; } } 上述abs()函 ...
- javascript学习笔记--迭代函数
概要 这里的迭代函数指的是对数组对象的操作方法,js数组共有五个迭代函数:every.fifter.forEach.map.some. 1.every every方法,返回值为Boolean类型,tr ...
- JavaScript学习03（函数）
函数 函数定义 JavaScript 函数是通过 function 关键词定义的. 声明定义 function functionName(parameters) { 要执行的代码 } 被声明的函数不会 ...
- 【JavaScript学习笔记】函数、数组、日期
一.函数 一个函数应该只返回一种类型的值. 函数中有一个默认的数组变量arguments,存储着传入函数的所有参数. 为了使用函数参数方便,建议给参数起个名字. function fun1(obj, ...
- JavaScript学习笔记（散）——addLoadEvent函数
先贴源码 function addLoadEvent(func) { var oldonload = window.onload; //存入当前onload事件 if(typeof window.on ...
- 理解和使用 JavaScript 中的回调函数
理解和使用 JavaScript 中的回调函数 标签: 回调函数指针js 2014-11-25 01:20 11506人阅读 评论(4) 收藏 举报 分类: JavaScript(4) 目录( ...
- JavaScript学习总结-技巧、有用函数、简洁方法、编程细节
整理JavaScript方面的一些技巧.比較有用的函数,常见功能实现方法,仅作參考 变量转换 //edit http://www.lai18.com var myVar = "3.14159 ...
随机推荐
- .net笔记
一.垃圾回收 1.运行.NET应用程序时,程序创建出来的对象都会被CLR跟踪, 2.哪些对象还会被用到(存在引用关系):哪些对象不会再被用到(不存在引用关系),CLR都是有记录的. 3.CLR会整理不 ...
- 使用NPOI将数据导出为word格式里的table
开发环境:VS2013+MySQL5.5+EF6+NPOI2.0.6 格式:WinForm+CodeFirst PS:vs2013的CodeFirst很方便了啊 CodeFirst方式就不再赘述了. ...
- 批量修改vss工作目录
vss作为源代码版本控制工具,可以针对不同的文件夹设置不同的本地工作目录,这样可以方便我们不同的个性化需求.但是往往实际情况是,我们设置了不同的工作目录,后来却发现导致引用混乱,每个人每次获取项目文件 ...
- java 多线程（ThreadPoolExecutor （补充））
import java.util.concurrent.ArrayBlockingQueue; import java.util.concurrent.ThreadPoolExecutor; impo ...
- AMD加载器实现笔记（二）
AMD加载器实现笔记(一)中,我们实现了一个简易的模块加载器.但到目前为止这个加载器还并不能称为AMD加载器,原因很简单,我们还不支持AMD规范中的config配置.这篇文章中我们来添加对config ...
- Java提高篇（二七）-----TreeMap
TreeMap的实现是红黑树算法的实现,所以要了解TreeMap就必须对红黑树有一定的了解,其实这篇博文的名字叫做:根据红黑树的算法来分析TreeMap的实现,但是为了与Java提高篇系列博文保持一致 ...
- js实现DOM结构
/* 编写一段js脚本生成下面的DOM结构.要求使用标准的DOM方法或属性 <div id='example'> <p class='slogan'>淘,你喜欢</p&g ...
- Comet实现的网页聊天程序
“上一篇”介绍了我在c/s程序中用了那些技术,如今只谈c/s不谈b/s那未免out了,势必要写一写b/s的程序与大家共勉. 回忆做技术这些年,06年每天盯着“天轰穿”的视频不亦乐乎,估计那是一代程序员 ...
- 我心中的核心组件（可插拔的AOP）~调度组件quartz.net
回到目录 quartz.net是一个任务调度组件,它可以灵活的设置你的调试方式,按时间,按日期,按周期都可以很容易的实现,quartz不仅可以用在web中,而且还可以部署在winform,winser ...
- MVVM架构~knockoutjs系列之验证信息自定义输出~再续
返回目录 对于一个项目的表单验证,方式有很多,效果也有很多,具体使用哪种完成取决于产品这边,产品让你用什么,你就要用什么,而做为开发人员,我们要做的就是＂整理近可能多的架构方式＂,这样才可以自由的应变 ...