jQuery $(document).ready()和window.onload

根据ready()方法的API说明http://api.jquery.com/ready/。

这个方法接收一个function类型的参数ready(handler), 方法的作用是: Specify a function to execute when the DOM is fully loaded.

即当DOM加载完毕的时候,执行这个指定的方法.
　　因为只有document的状态ready之后,对page的操作才是安全的.
　　$(document).ready()仅在DOM准备好的时候执行一次.
 
　　与之相比,load事件会等到页面渲染完成执行,即等到所有的资源(比如图片)都完全加载完成的时候.
　　$(window).load(function(){…})会等整个页面,不仅仅是DOM,还包括图像和iframes都准备好之后,再执行.
　　而ready()是在DOM准备好之后就执行了,即DOM树建立完成的时候.所以通常ready()是一个更好的时机.
 
　　如果DOM初始化完成之后再调用ready()方法,传入的新的handler将会立即执行.
 
　　注意:ready()方法多次调用,传入的handler方法会串联执行(追加).
　　而JavaScript中,window.onload是赋值一个方法,即后面的会覆盖掉前面的.
 

$(document).ready()的三种简写

　$( document ).ready( handler )

　$().ready( handler ) (this is not recommended)

　$( handler )

window对象和document对象

　Window对象表示浏览器中打开的窗口: http://www.w3school.com.cn/jsref/dom_obj_window.asp
　Document对象表示载入浏览器的HTML文档: http://www.w3school.com.cn/jsref/dom_obj_document.asp
 

Event对象

　　Event即事件,代表了各种状态:http://www.w3school.com.cn/jsref/dom_obj_event.asp
　　事件句柄使我们可以在事件发生的时候附加一些操作和处理,比如按钮点击事件发生的时候,进行什么什么操作.
　　上面的参考链接中含有一个属性列表,对应各种事件,可以利用这些属性定义事件的行为.
　　本文关注的onload就是其中一个事件.
 

onload事件

　　onload事件是在加载完成后立即发生.(注意其中的l是小写).
　　支持该事件的标签是:
　　<body>, <frame>, <frameset>, <iframe>, <img>, <link>, <script>
　　支持该事件的JavaScript对象是:
　　image, layer, window.
　　注意这里并没有document.

onload使用解析

　　最常用的就是window.onload, 会等到整个页面及各种资源都加载完成之后再执行后面赋值的function行为.
　　另外,可以在标签中使用onload,比如:
<body onload="inlineBodyOnloadTimeCounter();">
　　其中inlineBodyOnloadTimeCounter()是一个自定义的JavaScript function.
　　注意jQuery ready()的API文档中有这么一段: 
The .ready() method is generally incompatible with the attribute. If load must be used, either do not use .ready() or use jQuery's .load() method to attach load event handlers to the window or to more specific items, like images.

说明ready()方法和<body onload=“”>是不兼容的.

注：文章来源于转载。

jQuery $(document).ready()和window.onload的更多相关文章

  1. jquery mobile在页面加载时添加加载中效果 document.ready 和window.onload执行顺序比较

    想要添加这个效果,先来弄明白页面的加载和事件执行顺序,看这个简单例子: <html xmlns="http://www.w3.org/1999/xhtml"> < ...

  2. $(document).ready() 与 window.onload 之间的区别

    1.执行时机 window.onload 是网页中所有的元素都加载到浏览器后才执行 $(document).ready() 是dom完全就续就可以调用 例如:如果给一副图片添加点击事件,window. ...

  3. 转载jquery $(document).ready() 与window.onload的区别

    jquery $(document).ready() 与window.onload的区别 投稿:mdxy-dxy 字体:[增加 减小] 类型:转载 时间:2009-12-28我要评论 Jquery中$ ...

  4. jQuery的$(window).load与、(document).ready和window.onload的关系

    jQuery的$(window).load与.(document).ready和window.onload的关系 $(function() { console.log('document.ready ...

  5. $(document).ready()和window.onload之间的差异

    最近使用$(document).ready(function(){})遇到一个问题:加载页面后发送数据请求后台,得到的数据不对,后发现请求后台时,发送的数据为空,没有获取到值导致的.------改成w ...

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

    $(document).ready比window.onload先执行.window.onload只执行一次. $(document).ready和window.onload都是在都是在页面加载完执行的 ...

  7. 转 $(document).ready()与window.onload的区别

    $(document).ready()和window.onload在表单上看都是页面加载时我们就去执行一个函数或动作,但是在具体的细节上$(document).ready()和window.onloa ...

  8. jQuery中的$(window).load()与$(document).ready()以及jquery $(document).ready() 与window.onload的区别

    大多数jQuery实例或教程都告诉我们绑定我们的jQuery代码到$(document).ready事件.虽然$(document).ready 事件在大多数情况下都OK,但是它的解析顺序是在文档准备 ...

  9. $(document).ready和window.onload,细微小区别,ready是jQuery的方法,onload是window的方法

    $(document).ready和window.onload的区别 $(document).ready和window.onload都是在都是在页面加载完执行的函数,大多数情况下差别不大,但也是有区别 ...

随机推荐

  1. android 入门-控件 测量状态栏高度

    private ViewTreeObserver viewTreeObserver; /** 获取可見区域高度 **/ WindowManager manager = getWindowManager ...

  2. 浅学JSON——Json.NET之首次试手

    首次遭遇Json格式,缘由项目中用到Json数据,需要进行解析,为此,将Json数据转为了自己较为熟悉的DataTable格式,以此展示至DataGridView中,验证是否成功. 直接上代码: // ...

  3. NSDate用法整理总结

    int main(int argc, const char * argv[]) { @autoreleasepool { NSDate *date=[NSDate date]; NSLog(@&quo ...

  4. Jmeter之JDBC请求（四）

    我们常用的Jmeter中的功能又HTTP请求.JDBC Request.SOAP/XML -RPC Request,这3个请求, 现在就为大家介绍下 什么是JDBC请求 首先,大家右键点击“测试计划” ...

  5. 计数排序-java

    今天看了一本书,书里有道题,题目很常见,排序,明了点说: 需求:输入:最多有n个正整数,每个数都小于n, n为107 ,没有重复的整数 输出:按升序排列 思路:假设有一组集合 {1,3,5,6,11, ...

  6. 深入理解KMP算法

    前言:本人最近在看<大话数据结构>字符串模式匹配算法的内容,但是看得很迷糊,这本书中这块的内容感觉基本是严蔚敏<数据结构>的一个翻版,此书中给出的代码实现确实非常精炼,但是个人 ...

  7. node.js整理 05进程管理

    简介 NodeJS可以感知和控制自身进程的运行环境和状态,也可以创建子进程并与其协同工作,这使得NodeJS可以把多个程序组合在一起共同完成某项工作,并在其中充当胶水和调度器的作用 常用API Pro ...

  8. redis 的使用 (sort set排序集合类型操作)

    sort set排序集合类型 释义: sort set 是 string 类型的集合 sort set 的每个元素 都会关联一个 权 通过 权值 可以有序的获取集合中的元素 应用场合: 获取热门帖子( ...

  9. Python小例子（判断质数）

    只能被自己或者1整除的数为质数 num = int(input('请输入一个数:')) if num > 1: # 查看因子 for i in range(2, num): if (num % ...

  10. set+几何 LA 5908 Tracking RFIDs

    题目传送门 题意:给一些传感器,范围在r内,再给一些询问点,问这些点能有几个传感器收到,当有墙隔绝时信号减弱,范围变小 分析:set存储传感器,用set的find来查找是否是传感器.因为询问点少,可以 ...