$(window).load(function() {})和$(document).ready(function(){})的区别
JavaScript 中的以下代码 :
Window.onload
= function (){// 代码 }
等价于
Jquery 代码如下:
$(window).load(function
(){// 代码 });
$(function(){})等价于 $(document).ready(function(){});
$(function(){})是 $(document).ready(function(){})的简写
执行时机
window.load——必须等待网页中所有的内容加载完毕后 ( 包括图片 ) 才能执行
$(window).load(function (){// 代码
}); ——必须等待网页中所有的内容加载完毕后 ( 包括图片 ) 才能执行
$(document).ready()——网页中所有
DOM 结构绘制完毕后就执行,可以能 DOM 元素关联的内容并没有加载完
编写个数
window.load——不能同时编写多个以下代码无法正确执行:
window.onload
= function(){ alert(“text1”);};window.onload = function(){ alert(“text2”);};结果只输出第二个
注意:JavaScript的onload事件一次只能保存对一个函数的引用,他会自动用最后面的函数覆盖前面的函数。因为window.load是DOM2级事件,而$(window).load(function (){// 代码 });可以使用多次,只是前后执行,因为用的是DOM3级事件。
$(document).ready()——能同时编写多个以下代码正确执行:
$(document).ready(function(){
alert(“Hello World”);});$(document).ready(function(){ alert(“Hello again”);});
结果两次都输出
以 浏览器装载文档为例,在页面加载完毕后,浏览器会通过 Javascript 为 DOM 元素添加事件。在常规的 Javascript 代码中,通常使用 window.onload 方法,而在 Jquery 中,使用的是$(document).ready() 方法。 $(document).ready() 方法是事件模块中最重要一个函数,可以极大的提高Web
应用程序的速度。
另外,需要注意一点,由于在 $(document).ready()
方法内注册的事件,只要 DOM 就绪就会被执行,因此可能此时元素的关联文件未下载完。
例如与图片有关的 html 下载完毕,并且已经解析为 DOM 树了,但很有可能图片还没有加载完毕,所以例如图片的高度和宽度这样的属性此时不一定有效。要解决这个问题,可以使用 Jquery 中另一个关于页面加载的方法 ---load() 方法。
Load() 方法会在元素的onload 事件中绑定一个处理函数。
如果处理函数绑定给 window 对象,则会在所有内容 ( 包括窗口、框架、对象和图像等 ) 加载完毕后触发,如果处理函数绑定在元素上,则会在元素的内容加载完毕后触发。
随机推荐
- READ TABLE ..... BINARY SEARCH问题
Read Table 的语法很多,这里说一种特殊情况,Read Table 中查询的时候对标准内表经常有一种二分优化查找,用Binary search的时候首先必须要有查询条件:但如果查询条件满足的项 ...
- 直接拿来用!十大Material Design开源项目
来自:http://www.csdn.net/article/2014-11-21/2822753-material-design-libs/1 介于拟物和扁平之间的Material Design自面 ...
- 巩固一下:SpringMVC详细示例实战教程
一.SpringMVC基础入门,创建一个HelloWorld程序 1.首先,导入SpringMVC需要的jar包. 2.添加Web.xml配置文件中关于SpringMVC的配置 1 2 3 4 5 6 ...
- iOS开发init方法解析
自定义的init方法,都必须调用父类的init方法. 一般情况下为: - (id)init { [super init]; xxx = xxx; } 通常情况下,这种模式可以满 ...
- Spring AOP 四大通知
Spring AOP 四大通知 Spring 3.X 以前 1.前置通知,实现 MethodBeforeAdvice 接口,重写 public void before(Method metho ...
- Android微信登陆
前言 分享到微信朋友圈的功能早已经有了,但微信登录推出并不久,文档写的也并不是很清楚,这里记录分享一下. 声明 欢迎转载,但请保留文章原始出处:) 博客园:http://www.cnblogs.co ...
- 记一次eclipse无法启动的排查过程
起因是本地为开发工程打包,总是提示 source 1.3 不支持注释.enum等等,但询问开发开发表示自己本地打包正常. 于是排查版本问题.开发的jdk是1.6版本,自己的是1.7,于是想要不降级吧, ...
- Mac下的快速回到桌面快捷方式
今天突然发现一个Mac下快速回到桌面的快捷方式. command+F3 快速回到桌面. 如果想增加动画效果,快捷键是: command+shift+F3 这个功能虽然小,但是确实非常实用啊!
- 软工_个人项目反(shai)思(zhao)
这次作业成绩还算不错,但是也收获了很多的经验与教训,在这里总结一下. 需要继续改进的地方 作业提交方面仍旧有些问题.如助教所说,在GitHub中并没有保存已经编译好的exe文件,导致助教在检查作业的时 ...
- yii2发送邮件教程
作者:白狼 出处:http://www.manks.top/article/yii2_swiftMailer本文版权归作者,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接, ...