//ready事件
$(document).ready(function(){
代码........
}); //ready事件简写:
$(function(){
代码........
}); //load事件
$(document).load(function(){
代码.......
});

结论:ready和load事件的先后执行顺序是:先ready后load

要理解上面的结论,先来看看DOM文档加载的步骤:

1、解析HTML结构

2、加载外部脚本代码和css样式表

3、解析并执行脚本代码

4、构造HTML DOM模型  //ready

5、加载图片等外部文件

6、页面加载完毕  //load

由此可见,ready事件是在load事件之前执行的。

结论:

load和ready的区别在于资源文件的加载,ready构建了基本的DOM结构,所以对于代码来说加载越快应该越好。

为了防止在图片资源过多的情况下,没有触发load事件页面就过期而造成的问题,我们不能等到所有资源文件加载之后再触发load事件。

jQuery学习一:jQuery中的ready和load事件的更多相关文章

  1. jQuery中ready与load事件

    jQuery中ready与load事件(来自慕课网) jQuery有3种针对文档加载的方法 $(document).ready(function() { // ...代码... }) //docume ...

  2. jQuery中ready与load事件的区别

    1.摘要 大家在编程中使用jQuery还有JS的时候一定会在使用之前这样: //document ready $(document).ready(function(){ ...code... }) / ...

  3. 原 jQuery中document的ready和load事件的区别?

    概述: 大家在工作中用jQuery的时候一定会在使用之前这样:   1 2 3 4 5 6 7 8 //document ready $(document).ready(function(){     ...

  4. jQuery 中ready与load事件

    jquey有3种针对文档加载的方法: //document ready $(document).ready(function(){ //...代码... }) //document ready 简写 ...

  5. 锋利的JQuery学习之JQuery中的事件

    一.加载DOM 在页面加载完毕之后,浏览器会通过javascript为dom元素添加事件,在常规的javascript中使用window.onload方法,而在jQuery中使用的是$(documen ...

  6. jquery学习笔记---jquery插件开发

    http://www.cnblogs.com/Wayou/p/jquery_plugin_tutorial.html jquery插件开发:http://www.cnblogs.com/damonla ...

  7. (高级篇)jQuery学习之jQuery Ajax用法详解

    jQuery Ajax在web应用开发中很常用,它主要包括有ajax,get,post,load,getscript等等这几种常用无刷新操作方法,下面我来给各位同学介绍介绍. 我们先从最简单的方法看起 ...

  8. jQuery学习之jQuery Ajax用法详解

    jQuery Ajax在web应用开发中很常用,它主要包括有ajax,get,post,load,getscript等等这几种常用无刷新操作方法,下面我来给各位同学介绍介绍. 我们先从最简单的方法看起 ...

  9. jQuery学习之jQuery Ajax用法详解(转)

    [导读] jQuery Ajax在web应用开发中很常用,它主要包括有ajax,get,post,load,getscript等等这几种常用无刷新操作方法,下面我来给各位同学介绍介绍.我们先从最简单的 ...

随机推荐

  1. 【转】The Zen of Python

    http://www.python.org/dev/peps/pep-0020/ Beautiful is better than ugly. Explicit is better than impl ...

  2. hdu 5534 Partial Tree 背包DP

    Partial Tree Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://acm.hdu.edu.cn/showproblem.php?pid= ...

  3. hdu 5428 The Factor 分解质因数

    The Factor  Time Limit: 1 Sec Memory Limit: 256 MB 题目连接 http://bestcoder.hdu.edu.cn/contests/contest ...

  4. 用DirectShow实现视频採集-流程构建

    DirectShow作为DirectX的一个子集,它为用户提供了强大.方便的多媒体开接口,而且它拥有直接操作硬件的能力,这使得它的效率远胜于用GDI等图形方式编写的多媒体程序.前面一篇文章已经对Dir ...

  5. IOS 常用第三方库

    名称 特性 效果图 FXBlurView 实时背景模糊效果   FDFullscreenPopGesture 让UINavigationController在屏幕任何位置均可滑动返回 NJKWebVi ...

  6. 支持向量机(SVM)非线性数据切割

    支持向量机(SVM)非线性数据切割 1.目标 本指导中你将学到: l  当不可能线性切割训练数据时,如何定义SVM最优化问题. l  在这样的问题上.如何配置CvSVMParams中的參数满足你的SV ...

  7. iOS开发——UI篇OC篇&UIView/UIWindow/UIScreen/CALayer

    UIView/UIWindow/UIScreen/CALayer 1.UIScreen可以获取设备屏幕的大小. 1 2 3 4 5 6 7 // 整个屏幕的大小 {{0, 0}, {320, 480} ...

  8. MySQL并发复制系列二:多线程复制

     http://blog.itpub.net/28218939/viewspace-1975822/ 并发复制(Parallel Replication) 系列二: Enhanced Multi-th ...

  9. Ruby on Rails Tutorial 第六章 用户模型

    1.用户模型(1)数据库迁移Rails默认使用关系数据库存储数据,数据库中的表有数据行组成,每一行都有相应的列,对应数据属性.把列名命名为相应的名字后,ActiveRecord会自动把他们识别为用户对 ...

  10. Ruby on Rails Tutorial 第五章 完善布局

    本章目标:局部视图.Rails路由.Asset Pipeline.Sass1.Bootstrap是Twitter开发的开源Web设计框架mockup是网页构思图,在web领域经常称之为“线框图”,用于 ...