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. JS判断输入值是否为正整数

    JS中的test是原来是JS中检测字符串中是否存在的一种模式,JS输入值是否为判断正整数代码: <script type=”text/javascript”> function test( ...

  2. Windows系统上安装多个版本jdk,修改环境变量不生效

    本机已经安装了jdk1.6,而比较早期的项目需要依赖jdk1.5,于是同时在本机安装了jdk1.5和jdk1.6. 安装jdk1.5前,执行 java -version 得到java version ...

  3. SercureCRT无法正常连接Ubuntu14.0.4.1的解决办法

    问题描述 通过VirtualBox重新安装了ubuntu 14.0.4.1 虚拟服务器,在SercureCRT中使用root帐号连接ubuntu14.0.4.1的时候,提示“Password Auth ...

  4. Sql Server 基础知识

    Sql Server 基础知识: http://blog.csdn.net/t6786780/article/details/4525652 Sql Server 语句大全: http://www.c ...

  5. iOS沙盒机制的基本操作总结

    每个ios程序都有自己的沙盒(sandBox),ios8之后提供沙盒部分开放 我们可以访问沙盒下的文件夹 文件夹包括: 1,documents:保存应用运行时生成的需要持久化的数据 2.tem:保存临 ...

  6. 对于c语言int类型和float,以及double类型表示范围的计算

    首先说一下我原来错误的认识 int是32个bit, 如果我们把第一位理解为符号位,那么很显然int的范围是-(2^31-1)~2^31-1 但是实际上我们都知道int的最小值是-2^31次.. 为什么 ...

  7. sqlserver 作业调度(作业常用的几个步骤)

    --[作业常用的几个步骤] EXEC msdb.dbo.sp_delete_job EXEC msdb.dbo.sp_add_job EXEC msdb.dbo.sp_add_jobstep EXEC ...

  8. 仿IOS圆形下载进度条

    /** * Created by C058 on 2016/5/25. */ public class MyHoriztalProgressBar extends ProgressBar { priv ...

  9. Dialog+NumberPicker

      package com.gtercn.myapplication; import android.app.Activity; import android.content.DialogInterf ...

  10. 登录时的"记住我"

    当我们在做各个系统的登录界面时,喜欢在加上一个功能就是“记住我”, 我用js来实现一下看看 function SetCookie(name, value, expires, path, domain, ...