今天做项目的时候遇到一个问题，结果死在了$(document).ready()、 $('#id').load() 、window.onload的区别上。然后，就整理一下，这三者的区别。

参考文章：http://www.jb51.net/article/21628.htm     http://www.frontopen.com/900.html  http://blog.csdn.net/leobig/article/details/40737941

先说$(document).ready()和window.onload的区别

jQuery中的ready特指“DOM”全部加载完毕，也就是说，只要DOM加载完毕了，这个事件自然被触发了。
所谓“DOM”加载完毕指整个页面的标签部分全部加载完毕，至于说某些标签内部可能还存在着一系列事件未完成（譬如img标签可能加载远处一个很大的bmp图片尚未加载完毕等情况）则被忽略。因此对于单纯设置某些Html标签的事件或者属性的绑定而言，在ready方法中显然比load更为适合

load必须等到全部的标签都处于完成状态，包括img把图片全部加载完毕为止）。

1.执行时间

window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。

        $(document).ready()是DOM结构绘制完毕后就执行，不必等到加载完毕。

2.编写个数不同 
         window.onload不能同时编写多个，如果有多个window.onload方法，只会执行一个 
         $(document).ready()可以同时编写多个，并且都可以得到执行

3.简化写法 
         window.onload没有简化写法 
         $(document).ready(function(){})可以简写成$(function(){});

window.onload和$('#id').load() 是类似的

ready事件：

ready事件在DOM结构绘制完成之后就绘执行。这样能确保就算有大量的媒体文件没加载出来，JS代码一样可以执行。

load事件：

load事件必须等到网页中所有内容全部加载完毕之后才被执行。如果一个网页中有大量的图片的话，则就会出现这种情况：网页文档已经呈现出来，但由于网页数据还没有完全加载完毕，导致load事件不能够即时被触发。

总结： 

相信大家已经了解了ready与load的区别，其实如果页面中要是没有图片之类的媒体文件的话ready与load是差不多的，但是页面中有文件就不一样了，所以还是推荐大家在工作中用ready。

另外值得注意的是：

$(document).load是错误的，因为“load”并不是document对象的一个内置的方法；如果要人为为某个标签对象增加一个自定义事件，在jQuery中你只能使用bind方法增加一个自定义的事件，然后必须使用trigger去人为触发这个自定义事件。

随机推荐

1. js与java正则表达式处理字符串问题

   在编写处理字符串的程序或网页时,经常会有查找符合某些复杂规则的字符串的需要.正则表达式就是用于描述这些规则的工具.换句话说,正则表达式就是记录文本规则的代码.合理使用正则表达式确实会为程序员省去很多字 ...

2. 大白话讲解Promise（二）理解Promise规范

   上一篇我们讲解了ES6中Promise的用法,但是知道了用法还远远不够,作为一名专业的前端工程师,还必须通晓原理.所以,为了补全我们关于Promise的知识树,有必要理解Promise/A+规范,理解 ...

3. devpress 的gridview 控件的行拖拽 z

   首先,添加引用:using DevExpress.XtraGrid.Views.Grid.ViewInfo;               gridControl1.AllowDrop = true; ...

4. dedecms在首页或列表调取文章内容body的三个方法

   有时需要在网站首页或栏目封面上显示几篇文章的内页作为导语或其他什么的,但acrlist标签是不能直接调取body的,这时我们就需要使用以下方法来调取body. 方法一:arcticle 标签 加上ch ...

5. ASP.NET MVC3入门教程之环境搭建

   本文转载自:http://www.youarebug.com/forum.php?mod=viewthread&tid=90&extra=page%3D1 什么是ASP.NET MVC ...

6. leecode 每日解题思路 64	Minimum Path Sum

   题目描述: 题目链接:64 Minimum Path Sum 问题是要求在一个全为正整数的 m X n 的矩阵中, 取一条从左上为起点, 走到右下为重点的路径, (前进方向只能向左或者向右),求一条所 ...

7. SQL 合并列值和拆分列值

   合并列值 表结构,数据如下: id value ----- ------ aa bb aaa bbb ccc 需要得到结果: id values ------ ----------- aa,bb aa ...

8. 洗礼灵魂，修炼python（61）--爬虫篇—【转载】requests模块

   requests 1.简介 Requests 是用Python语言编写的第三方库,所以你需要pip安装,安装过程就略过了.它基于urllib,采用 Apache2 Licensed 开源协议的 HTT ...

9. vim插件的安装方式 -- vim注释插件和doxygen函数注释生成插件-ctrlp插件-tabular等号对齐 插件

   使用unzip的时候 指定 -d选项, 是说明解压到的 目标地址. 这个参数还是比较方便的, 比直接unzip到当前目录, 然后在去拷贝到目标目录, 然后再删除当前目录中的解压文件夹, 方便多了. 使 ...

10. python之旅：python中range()和len()函数区别

    函数:len() 作用:返回字符串.列表.字典.元组等长度 语法:len(str) 参数: str:要计算的字符串.列表.字典.元组等 返回值:字符串.列表.字典.元组等元素的长度 实例 1.计算字符 ...