jq的$(function(){})与window.onload的区别
最近一直在研究jq的源码,书写jq的代码我们通常会包裹在一个$(function(){})
函数中,
jq的$(function(){})
也就是$(document).ready(function(){})
的简写,与之对应的原生js的window.onload
事件,这俩者之间到底有什么区别呢?
$(function () {
console.log("ready执行");
});
$(function() {
console.log("ready1执行");
});
window.onload = function () {
console.log('load执行');
};
window.onload = function () {
console.log('load1执行');
}
我们来看一下控制台中输出的结果:
这里可以看出两点不同:
1.$(function(){})
不会被覆盖,而window.onload
会被覆盖,个人感觉$(function(){})
不会被覆盖的原因是将其放入到了一个队列中,在对应时机一次出队。
2. $(function(){})
在window.onload
执行前执行的,$(function(){})
类似于原生js中的DOMContentLoaded
事件,在DOM加载完毕后,页面全部内容(如图片等)完全加载完毕前被执行。而window.onload
会在页面资源全部加载完毕后才会执行。
DOM文档加载步骤:
1.解析HTML结构
2.加载外部的脚本和样式文件
3.解析并执行脚本代码
4.执行$(function(){})
内对应代码
5.加载图片等二进制资源
6.页面加载完毕,执行window.onload
jq的$(function(){})与window.onload的区别的更多相关文章
- $(function(){})与window.onload的区别
不太一样window.onload是在页面所有的元素都加载完成后才触发$(function(){})是在页面的dom结构加载完毕后就触发 dom里的内容不一定都已经加载完成比如说一个页面有好多图片 而 ...
- $(function(){})和window.onload的区别
(1)$(function(){}):DOM节点创建 完成才执行 (2)window.onload:页面所有资源(JS/CSS)加载完成才执行
- JQ的ready()方法与window.onload()的区别与联系
JQ的ready()与window.onload()方法都是在文档加载完毕之后才会被触发的方法,但它们之间的区别也是很明显的. 1.区别与联系: $(document).ready() windo ...
- jQuery中$(document).ready()和window.onload的区别?
document.ready和document.load的区别?(JQ中的$(document).ready()和window.onload的区别?) window.onload,是采用DOM0级事件 ...
- 转载jquery $(document).ready() 与window.onload的区别
jquery $(document).ready() 与window.onload的区别 投稿:mdxy-dxy 字体:[增加 减小] 类型:转载 时间:2009-12-28我要评论 Jquery中$ ...
- $(document).ready() 、 $('#id').load() 、window.onload 的区别
今天做项目的时候遇到一个问题,结果死在了$(document).ready(). $('#id').load() .window.onload的区别上.然后,就整理一下,这三者的区别. 参考文章:ht ...
- body里面的onload和window.onload的区别
区别:body里面的onload是在“页面加载完成后执行的动作” window里面的onload是在“页面加载时执行的动作” 例子:在html页面中有一个大图片,想要在图片显示出来后提示一个消息框“图 ...
- jQuery中的$(window).load()与$(document).ready()以及jquery $(document).ready() 与window.onload的区别
大多数jQuery实例或教程都告诉我们绑定我们的jQuery代码到$(document).ready事件.虽然$(document).ready 事件在大多数情况下都OK,但是它的解析顺序是在文档准备 ...
- 深入理解,函数声明、函数表达式、匿名函数、立即执行函数、window.onload的区别.
一.函数声明.函数表达式.匿名函数1.函数声明:function fnName () {…};使用function关键字声明一个函数,再指定一个函数名,叫函数声明. 2.函数表达式 var fnNam ...
随机推荐
- 分布式缓存设计:一致性Hash算法
缓存作为数据库前的一道屏障,它的可用性与缓存命中率都会直接影响到数据库,所以除了配置主从保证高可用之外还需要设计分布式缓存来扩充缓存的容量,将数据分布在多台机器上如果有一台不可用了对整体影响也比较小. ...
- python--条件判断和循环--3
原创博文,转载请标明出处--周学伟http://www.cnblogs.com/zxouxuewei/ 一.if语句 计算机之所以能做很多自动化的任务,因为它可以自己做条件判断. 比如,输入用户年龄, ...
- Java精选笔记_Java编程基础
Java的基本语法 Java代码的基本格式 修饰符 class 类名 { 程序代码 } 一个Java源文件只定义一个类,不同的类使用不同的源文件定义:将每个源文件中单独定义的类都定义成public ...
- oracle中获取执行计划
1. 预估执行计划 - Explain PlanExplain plan以SQL语句作为输入,得到这条SQL语句的执行计划,并将执行计划输出存储到计划表中. 首先,在你要执行的SQL语句前加expla ...
- Java信号量 Semaphore 介绍
一.介绍 Semaphore当前在多线程环境下被扩放使用,操作系统的信号量是个很重要的概念,在进程控制方面都有应用.Java 并发库 的Semaphore 可以很轻松完成信号量控制,Semaphore ...
- IIC协议
总线信号 : SDA :串行数据线 SCL :串行时钟 总线空闲状态 : SDA :高电平 SCL :高电平 起始位:SCL为高电平期间 SDA出现下降沿 终止位:SCL为高电平期间 SDA ...
- CentOS6.4配置163的yum源
CentOS系统自带的更新源的速度实在是慢,为了让CentOS6使用速度更快的YUM更新源,可以选择163(网易)的更新源. 1.下载repo文件 wget http://mirrors.163.co ...
- 【PHPstudy】安装Composer
1 正确安装phpstudy,启动,右下角 右键选择 cms命令行 2 输入以下命令, 查看是否正确输出版本号. php -v 3 打开命令行并依次执行下列命令安装最新版本的 Composer: ph ...
- ubuntu android studio kvm
Android studio 启动模拟器失败: Cannot launch AVD in emulator.Output:emulator: ERROR: x86 emulation currentl ...
- iOS面试2
转:http://www.cocoachina.com/ios/20151106/14069.html 作者:seedante 授权本站转载. 题目来自博客:面试百度的记录,有些问题我能回答一下,不能 ...