【jquery】$(document).ready() 与window.onload的区别
Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法,不过与window.onload方法还是有区别的。
  1)执行时间 
  window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。 
  $(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕。
  2)编写个数不同 
  window.onload不能同时编写多个,如果有多个window.onload方法,只会执行一个 
  $(document).ready()可以同时编写多个,并且都可以得到执行 
  3)简化写法 
  window.onload没有简化写法 
  $(document).ready(function(){})可以简写成$(function(){});
以 浏览器装载文档为例,在页面加载完毕后,浏览器会通过 Javascript 为 DOM 元素添加事件。在常规的 Javascript 代码中,通常使用 window.onload 方法,而在 Jquery 中,使用的是 $(document).ready() 方法。 $(document).ready() 方法是事件模块中最重要一个函数,可以极大的提高 Web 应用程序的速度。
| window.onload | $(document).ready() | |
| 
 执行时机  | 
必须等待网页中所有的内容加载完毕后 ( 包括图片 ) 才能执行 | 网页中所有 DOM 结构绘制完毕后就执行,可以能 DOM 元素关联的内容并没有加载完 | 
| 
 编写个数  | 
不能同时编写多个  以下代码无法正确执行: window.onload = function(){ alert(“text1”); }; window.onload = function(){ alert(“text2”); }; 结果只输出第二个  | 
能同时编写多个  以下代码正确执行: $(document).ready(function(){ alert(“Hello World”); }); $(document).ready(function(){ alert(“Hello again”); }); 结果两次都输出  | 
| 
 简化写法  | 
无 | $(function(){  // do something });  | 
另外,需要注意一点,由于在 $(document).ready() 方法内注册的事件,只要 DOM 就绪就会被执行,因此可能此时元素的关联文件未下载完。例如与图片有关的 html 下载完毕,并且已经解析为 DOM 树了,但很有可能图片还没有加载完毕,所以例如图片的高度和宽度这样的属性此时不一定有效。
参考资料:http://www.jb51.net/article/21628.htm
【jquery】$(document).ready() 与window.onload的区别的更多相关文章
- 转载jquery $(document).ready() 与window.onload的区别
		
jquery $(document).ready() 与window.onload的区别 投稿:mdxy-dxy 字体:[增加 减小] 类型:转载 时间:2009-12-28我要评论 Jquery中$ ...
 - jQuery中的$(window).load()与$(document).ready()以及jquery $(document).ready() 与window.onload的区别
		
大多数jQuery实例或教程都告诉我们绑定我们的jQuery代码到$(document).ready事件.虽然$(document).ready 事件在大多数情况下都OK,但是它的解析顺序是在文档准备 ...
 - jQuery中$(document).ready()和window.onload的区别?
		
document.ready和document.load的区别?(JQ中的$(document).ready()和window.onload的区别?) window.onload,是采用DOM0级事件 ...
 - 转 $(document).ready()与window.onload的区别
		
$(document).ready()和window.onload在表单上看都是页面加载时我们就去执行一个函数或动作,但是在具体的细节上$(document).ready()和window.onloa ...
 - document.ready与window.onload的区别
		
代码分析: $(document).ready(function() { .... }); window.onload=function(){ ....} 两段代码功能上可以互换,但又有许多区别: 1 ...
 - $(document).ready和window.onload的区别
		
$(document).ready比window.onload先执行.window.onload只执行一次. $(document).ready和window.onload都是在都是在页面加载完执行的 ...
 - $(document).ready 与 window.onload的区别?
		
$(document).ready = function(){}; DOM树加载完成时执行,此时文件不一定都已加载完成. window.onload = function(){}; DOM树加载完成 ...
 - 谈谈document.ready和window.onload的区别
		
在Jquery里面,我们可以看到两种写法:$(function(){}) 和$(document).ready(function(){}) 这两个方法的效果都是一样的,都是在dom文档树加载完之后执行 ...
 - JS 页面加载触发事件 document.ready和window.onload的区别
		
document.ready和onload的区别——JavaScript文档加载完成事件页面加载完成有两种事件: 一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件): 二是onlo ...
 - [Javascript]jquery $(document).ready() 与window.onload的区别
		
引用:http://www.jb51.net/article/21628.htm Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload ...
 
随机推荐
- JavaScript 将行结构数据转化为树形结构,可提供给常用的tree插件直接使用(高效转化方案)
			
前台接收到的数据格式 var rows=[{ parent: 'root', id: 'DC', title: '集团' }, { parent: 'DC', id: '01', title: '上海 ...
 - Android NDK开发篇(六):Java与原生代码通信(异常处理)
			
一.捕获异常 异常处理是Java中的功能.在Android中使用SDK进行开发的时候常常要用到.Android原生代码在运行过程中假设遇到错误,须要检測,并抛出异常给Java层.运行原生代码出现了问题 ...
 - powerdesigner 不显示表字段只显示表名
			
在空白的地方右键选择 Display Preferences然后在左边的General Settings里选Table然后把Columns 的All Columns勾上 如果能帮上您,请选为满意答案, ...
 - android中Snackbar(Design Support)的使用
			
Snackbar是Android Design Support Library中的一个组件,想使用Snackbar,必须先引入Design Support,我这里引入的是当前的最新版本: implem ...
 - Unity3d for beginners
			
tutorial addr: https://www.youtube.com/watch?v=QUCEcAp3h28 1.打开Unity3d File->newProject ->cre ...
 - [Python]将Excel文件中的数据导入MySQL
			
Github Link 需求 现有2000+文件夹,每个文件夹下有若干excel文件,现在要将这些excel文件中的数据导入mysql. 每个excel文件的第一行是无效数据. 除了excel文件中已 ...
 - 轻松把玩HttpClient之封装HttpClient工具类(五),携带Cookie的请求
			
近期更新了一下HttpClientUtil工具类代码,主要是加入了一个參数HttpContext,这个是用来干嘛的呢?事实上是用来保存和传递Cookie所须要的. 由于我们有非常多时候都须要登录.然后 ...
 - stardict dict url
			
http ://download.huzheng.org/zh_CN/ tar -xjvf a.tar.bz2 -C /usr/share/stardict/dic
 - Flash:利用Bitmapdata,ColorTransform,DrawPath,制造绚丽效果
			
JamesLi的文章:http://www.adobe.com/cn/devnet/actionscript/articles/silkflash-as.html 总结一下绚丽效果的核心: 1.利用一 ...
 - VREP中的二维激光雷达
			
目前,轮式机器人的研究中已经大量使用激光雷达辅助机器人的避障导航,考虑到使用成本,一般二维激光雷达使用较多,如下图.由于只能扫描一个平面,如果想用二维激光雷达获取环境三维点云,则需要通过移动机器人或加 ...