jquery $(document).ready()和window.onload的区别浅析


Posted in Javascript onFebruary 04, 2015

Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法,不过与window.onload方法还是有区别的。

1.执行时间
        window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。
        $(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕。
2.编写个数不同
         window.onload不能同时编写多个,如果有多个window.onload方法,只会执行一个
         $(document).ready()可以同时编写多个,并且都可以得到执行
3.简化写法
         window.onload没有简化写法
         $(document).ready(function(){})可以简写成$(function(){});

在我以前的开发中,一般用到javascript,我都是采用jquery的模式,也就是大多数时候,第一行写的是:

$(document).ready(function(){

…

});

这个时候,不一定要等所有的js和图片加载完毕,就可以执行一些方法,不过有些时候,必须要等所有的

元素都加载完毕,才可以执行一些方法的时候,比如说,部分图片或者什么其他方面还没有加载好,这个时候,点击某些按钮,会导致出现意外的情况,这个时候,就

需要用到:

$(window).load(function() {

…
});

总结对比:

jquery $(document).ready()和window.onload的区别浅析

Javascript 相关文章推荐
学习jquery之一
Apr 27 Javascript
jquery ajax的success回调函数中实现按钮置灰倒计时
Nov 19 Javascript
javascript中使用new与不使用实例化对象的区别
Jun 22 Javascript
超赞的jQuery图片滑块动画特效代码汇总
Jan 25 Javascript
jQuery easyui刷新当前tabs的方法
Sep 23 Javascript
基于vue实现swipe轮播组件实例代码
May 24 Javascript
js学习总结_基于数据类型检测的四种方式(必看)
Jul 04 Javascript
浅析JavaScript中的平稳退化(graceful degradation)
Jul 24 Javascript
vue todo-list组件发布到npm上的方法
Apr 04 Javascript
element 中 el-menu 组件的无限极循环思路代码详解
Apr 26 Javascript
js实现手表表盘时钟与圆周运动
Sep 18 Javascript
vue.js封装switch开关组件的操作
Oct 26 Javascript
使用jQueryMobile实现滑动翻页效果的方法
Feb 04 #Javascript
jQueryMobile之Helloworld与页面切换的方法
Feb 04 #Javascript
Javascript中实现trim()函数的两种方法
Feb 04 #Javascript
jQuery手机浏览器中拖拽动作的艰难性分析
Feb 04 #Javascript
JavaScript检测实例属性, 原型属性
Feb 04 #Javascript
Jquery Ajax xmlhttp请求成功问题
Feb 04 #Javascript
js对字符的验证方法汇总
Feb 04 #Javascript
You might like
php 正确解码javascript中通过escape编码后的字符
2010/01/28 PHP
php安全配置 如何配置使其更安全
2011/12/16 PHP
PHP字符串word末字符实现大小写互换的方法
2014/11/10 PHP
PHP遍历数组的三种方法及效率对比分析
2015/02/12 PHP
javascript 混合的构造函数和原型方式,动态原型方式
2009/12/07 Javascript
javaScript复制功能调用实现方案
2012/12/13 Javascript
Bootstrap滚动监听(Scrollspy)插件详解
2016/04/26 Javascript
Knockoutjs 学习系列(二)花式捆绑
2016/06/07 Javascript
Javascript中indexOf()和lastIndexOf应用方法实例
2016/08/24 Javascript
基于JavaScript实现验证码功能
2017/04/01 Javascript
详解vue-router 2.0 常用基础知识点之router-link
2017/05/10 Javascript
对于Javascript 执行上下文的全面了解
2017/09/05 Javascript
在 Linux/Unix 中不重启 Vim 而重新加载 .vimrc 文件的流程
2018/03/21 Javascript
vue中使用gojs/jointjs的示例代码
2018/08/24 Javascript
webpack+vue-cli项目中引入外部非模块格式js的方法
2018/09/28 Javascript
解决layui数据表格table的横向滚动条显示问题
2019/09/04 Javascript
Javascript实现秒表计时游戏
2020/05/27 Javascript
[02:32]DOTA2完美大师赛场馆静安体育中心观赛全攻略
2017/11/08 DOTA
Python递归遍历列表及输出的实现方法
2015/05/19 Python
python自动zip压缩目录的方法
2015/06/28 Python
Python中的数据对象持久化存储模块pickle的使用示例
2016/03/03 Python
python各种语言间时间的转化实现代码
2016/03/23 Python
利用Python-iGraph如何绘制贴吧/微博的好友关系图详解
2017/11/02 Python
Python随机生成均匀分布在三角形内或者任意多边形内的点
2017/12/14 Python
python3 kmp 字符串匹配的方法
2018/07/07 Python
python中pip的使用和修改下载源的方法
2019/07/08 Python
基于python分析你的上网行为 看看你平时上网都在干嘛
2019/08/13 Python
Python selenium的基本使用方法分析
2019/12/21 Python
django中url映射规则和服务端响应顺序的实现
2020/04/02 Python
Python中Selenium库使用教程详解
2020/07/23 Python
python程序实现BTC(比特币)挖矿的完整代码
2021/01/20 Python
html5构建触屏网站之touch事件介绍
2013/01/07 HTML / CSS
草莓巧克力:Shari’s Berries
2017/02/07 全球购物
华为的Java面试题
2014/03/07 面试题
秋季运动会开幕词
2015/01/28 职场文书
JS 基本概念详细介绍
2021/10/16 Javascript