//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. jsp页面用el表达式获取枚举的code

    jsp页面用el表达式获取枚举的code <c:set var="D_BUSINESS" value="<%=DeptEnum.D_BUSINESS%> ...

  2. C语言用static限制函数以及全局变量的作用域

    今天才发现这个东西! C语言中没有public private之类的东西. 如果一个函数或者一个全局变量只想在一个.c文件中使用,可以在前面加上static! 以前我还傻傻的每个.c文件中的函数都加一 ...

  3. CDOJ 483 Data Structure Problem DFS

    Data Structure Problem Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://acm.uestc.edu.cn/#/proble ...

  4. HTML5 服务器推送事件(Server-sent Events)实战开发

    转自:http://www.ibm.com/developerworks/cn/web/1307_chengfu_serversentevent/ http://www.ibm.com/develop ...

  5. [AngularJS] New in Angular 1.3 - Performance Boost with debugInfoEnabled

    By default, Angular provides a lot of debug information on the DOM that's only necessary for tools l ...

  6. android150 笔记

    1. 什么是Activity? 四大组件之一,一般的,一个用户交互界面对应一个activity,界面的容器. setContentView() ,// 要显示的布局 button.setOnclick ...

  7. android139 360 黑名单 增删改查-数据库操作

    BlackNumberOpenHelper.java package com.itheima52.mobilesafe.db.dao; import android.content.Context; ...

  8. Online ddl 思维导图

    http://blog.itpub.net/22664653/viewspace-2056953/   整理一份 MySQL DDL 的思维导图,介绍5.5版本以及之前 和 5.6 版本的 MySQL ...

  9. C++_快速排序

    void quick_sort(int s[],int l,int r) { if(l<r) { int i=l,j=r,x=s[l]; while(i<j) { while( i< ...

  10. MySQL中的WITH ROLLUP

    MySQL中的WITH ROLLUP MySQL的扩展SQL中有一个非常有意思的应用WITH ROLLUP,在分组的统计数据的基础上再进行相同的统计(SUM,AVG,COUNT…),非常类似于Orac ...