jQuery中的ready函数与window.onload谁先执行


Posted in Javascript onJune 21, 2016

A.关于$(document).ready():

jquery中的$(document).ready(),那$(document).ready()到底是什么作用呢?是不是可以用window.onload = function(){ ... }来实现呢?

这里,我们要明确二者之间的区别。

我们使用window.onload = function(){ ... },是希望在页面被载入时执行function中的处理,但是这些JS代码只有在页面上的全部内容加载完成(包括头部的banner广告,所有图片)的时候才会执行。将window.onload放在最上边的原因就是当你第一次运行codes的时候,HTML'document'还没有加载完成。

而$(document).ready()却不需要载入得这么“完全”。$(document).ready()是在DOM结构载入完后执行的,而 window.onload是得在所有文件都加载完后执行的,注意区别,一个是DOM加载完,一个是所有文件加载完。因此,ready肯定在onload 之前发生,页面加载大或者多的图片而使onload执行延后,使用jquery的ready可缓解此问题。

我们应该紧记,jquery的ready是指在页面的DOM模型加载完后执行指定的函数。之所以经常用$(document).ready()来取代 window.onload,就是因为它是在dom模型加载完成后就执行,而window.onload是在dom元素加载完全后才执行。

B.关于document.onload和window.onload:

document.onload和window.onload没有本质的区别,都是指页面载入完成后执行指定函数。

做一个比较吧:

window .onload =function (){alert ("welcome");}
 $(document).ready(
 function (){
  alert ("thanks for visiting!");
 }
);

运行后你会发现 $(document).ready()先执行。

以上就是本文的全部内容,了解更多jQuery的语法,大家可以查看:《jQuery 1.10.3 在线手册》,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript iframe的相互操作浅析
Oct 14 Javascript
fancybox1.3.1 基于Jquery的插件在IE中图片显示问题
Oct 01 Javascript
jquery一句话全选/取消全选
Mar 01 Javascript
js下获得客户端操作系统的函数代码(1:vista,2:windows7,3:2000,4:xp,5:2003,6:2008)
Oct 31 Javascript
jQuery实现默认是闭合的FAQ展开效果菜单
Sep 14 Javascript
CascadeView级联组件实现思路详解(分离思想和单链表)
Apr 12 Javascript
实例讲解JavaScript的Backbone.js框架中的View视图
May 05 Javascript
利用ES6的Promise.all实现至少请求多长时间的实例
Aug 28 Javascript
十分钟带你快速了解React16新特性
Nov 10 Javascript
vue.js与element-ui实现菜单树形结构的解决方法
Apr 21 Javascript
详解Angular Forms中自定义ngModel绑定值的方式
Dec 10 Javascript
vue项目创建步骤及路由router
Jan 14 Javascript
纯JS前端实现分页代码
Jun 21 #Javascript
jQuery AJAX timeout 超时问题详解
Jun 21 #Javascript
jQuery代码性能优化的10种方法
Jun 21 #Javascript
JS实现兼容各种浏览器的获取选择文本的方法【测试可用】
Jun 21 #Javascript
JS实现兼容各种浏览器的高级拖动方法完整实例【测试可用】
Jun 21 #Javascript
JavaScript检测原始值、引用值、属性
Jun 20 #Javascript
Js 获取当前函数参数对象的实现代码
Jun 20 #Javascript
You might like
用PHP将数据导入到Foxmail
2006/10/09 PHP
php实现简易聊天室应用代码
2015/09/23 PHP
PHP数组中头部和尾部添加元素的方法(array_unshift,array_push)
2017/04/10 PHP
PHP基于phpqrcode类生成二维码的方法详解
2018/03/14 PHP
JS 控制非法字符的输入代码
2009/12/04 Javascript
JS高级笔记
2011/07/13 Javascript
Javascript中Event属性搜集整理
2013/09/17 Javascript
js获取页面传来参数的方法
2014/09/06 Javascript
Javascript writable特性介绍
2015/02/27 Javascript
JavaScript中字面量与函数的基本使用知识
2015/10/20 Javascript
JS动态创建元素的两种方法
2016/04/20 Javascript
用JavaScript获取页面文档内容的实现代码
2016/06/10 Javascript
微信小程序 picker 组件详解及简单实例
2017/01/10 Javascript
JS 60秒后重新发送验证码的实例讲解
2017/07/26 Javascript
angular4强制刷新视图的方法
2018/10/09 Javascript
如何在Angular应用中创建包含组件方法示例
2019/03/23 Javascript
vue实现手机号码的校验实例代码(防抖函数的应用场景)
2019/09/05 Javascript
layui的layedit富文本赋值方法
2019/09/18 Javascript
Vue实现导航栏的显示开关控制
2019/11/01 Javascript
vue改变循环遍历后的数据实例
2019/11/07 Javascript
浅析JS中NEW的实现原理及重写
2020/02/20 Javascript
python下载文件记录黑名单的实现代码
2017/10/24 Python
Python 中Pickle库的使用详解
2018/02/24 Python
python版opencv摄像头人脸实时检测方法
2018/08/03 Python
Python获取、格式化当前时间日期的方法
2020/02/10 Python
解决PDF 转图片时丢文字的一种可能方式
2021/03/04 Python
New Balance天猫官方旗舰店:始于1906年,百年慢跑品牌
2017/11/15 全球购物
2014年国庆节演讲稿
2014/09/02 职场文书
八荣八耻演讲稿
2014/09/15 职场文书
学校师德师风整改措施
2014/10/27 职场文书
2015国庆节66周年演讲稿
2015/03/20 职场文书
2015年119消防宣传日活动总结
2015/03/24 职场文书
火烧圆明园的观后感
2015/06/03 职场文书
公司欠款证明
2015/06/24 职场文书
会议开幕致辞怎么写
2016/03/03 职场文书
Python基础之条件语句详解
2021/06/16 Python