一张表格告诉你windows.onload()与$(document).ready()的区别

 更新时间:2014年05月16日 09:05:39   作者:  
这篇文章主要介绍了windows.onload()与$(document).ready()的区别

浏览器加载完DOM后,会通过javascript为DOM元素添加事件,在javascript中,通常使用window.onload()方法。

在jquery中,则使用$(document).ready()方法。下面介绍一下两者的区别。

  window.onload() $(document).ready()
执行时机 在页面所有元素(包括图片,引用文件)加载完后执行。

页面中所有HTML DOM,CSS DOM结构加载完之后就会执行,其他图片可能没有加载完.

如果想要网页所有内容(包括图片等)加载完毕,再注册事件,使用$(window).load(function);

等价于window.onload()

编写个数

不能同时写多个,后面的将会覆盖前面的。ex:

window.onload=function(){ alert("A"); }

window.onload=function(){ alert("B"); }

结果会执行“B”

如果想要顺序执行alert("A")和alert("B")需写成

window.onload=function(){

alert("A");

alert("B");

}

可以同时写多个
简写

$(document).ready(function(){

  //to do;

});

可写成

$().ready(function(){ //$()不带参数默认是document

  //to do;

});或

$(function(){

  //to do;

});

 

相关文章

  • Jquery实战_读书笔记1—选择jQuery

    Jquery实战_读书笔记1—选择jQuery

    近期公司积极组织我们这些开发人员学习进步,督促我们学习更多的技术来提高自己。为此我选择了jQuery作为我学习的方向,同时我也是想将我的学习心得分享给大家,以后我会不断的更新一系列jQuery方面的学习纪要,帮助大家学习。
    2010-01-01
  • jQuery实现图片高亮显示

    jQuery实现图片高亮显示

    这篇文章主要为大家详细介绍了jQuery实现图片高亮显示,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-10-10
  • 20个非常棒的 jQuery 幻灯片插件和教程分享

    20个非常棒的 jQuery 幻灯片插件和教程分享

    jQuery 是一个非常优秀的 JavaScript 框架,使用简单灵活,同时还有许多成熟的插件可供选择,它可以帮助你在项目中加入一些非常好的效果。
    2011-08-08
  • JQuery live函数

    JQuery live函数

    给指定id或class的元素绑定(bind)事件时,对于改变或新加的元素,事件不会起作用,这时我们就要用live函数,它可以让子元素继承父元素的事件。
    2010-12-12
  • jquery实现计算器小功能

    jquery实现计算器小功能

    这篇文章主要为大家详细介绍了jquery实现计算器小功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-07-07
  • jQuery中document与window以及load与ready 区别详解

    jQuery中document与window以及load与ready 区别详解

    这篇文章主要介绍了jQuery中document与window以及load与ready 区别详解,需要的朋友可以参考下
    2014-12-12
  • jquery.cookie.js的介绍与使用方法

    jquery.cookie.js的介绍与使用方法

    相信大家都知道jquery.cookie.js是一个轻量级的cookie 插件,可以读取、写入、删除 cookie。下面这篇文章就来给大家简单的介绍下关于jquery.cookie.js的介绍与使用方法,需要的朋友可以参考借鉴,一起来看看吧。
    2017-02-02
  • 基于jQuery实现响应式圆形图片轮播特效

    基于jQuery实现响应式圆形图片轮播特效

    这篇文章主要介绍了基于jQuery实现响应式圆形图片轮播特效,mislider插件可以将图片以圆形图片显示,然后使图片无限循环形成轮播图或旋转木马特效,感兴趣的小伙伴们可以参考一下
    2015-11-11
  • jQuery中[attribute^=value]选择器用法实例

    jQuery中[attribute^=value]选择器用法实例

    这篇文章主要介绍了jQuery中[attribute^=value]选择器用法,实例分析了[attribute^=value]选择器的功能、定义及匹配以某些值开始的元素的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2014-12-12
  • jquery实现侧边栏左右伸缩效果的示例

    jquery实现侧边栏左右伸缩效果的示例

    下面小编就为大家分享一篇jquery实现侧边栏左右伸缩效果的示例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2017-12-12

最新评论