最近一直在研究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的区别的更多相关文章

  1. $(function(){})与window.onload的区别

    不太一样window.onload是在页面所有的元素都加载完成后才触发$(function(){})是在页面的dom结构加载完毕后就触发 dom里的内容不一定都已经加载完成比如说一个页面有好多图片 而 ...

  2. $(function(){})和window.onload的区别

    (1)$(function(){}):DOM节点创建 完成才执行 (2)window.onload:页面所有资源(JS/CSS)加载完成才执行

  3. JQ的ready()方法与window.onload()的区别与联系

    JQ的ready()与window.onload()方法都是在文档加载完毕之后才会被触发的方法,但它们之间的区别也是很明显的. 1.区别与联系:   $(document).ready() windo ...

  4. jQuery中$(document).ready()和window.onload的区别?

    document.ready和document.load的区别?(JQ中的$(document).ready()和window.onload的区别?) window.onload,是采用DOM0级事件 ...

  5. 转载jquery $(document).ready() 与window.onload的区别

    jquery $(document).ready() 与window.onload的区别 投稿:mdxy-dxy 字体:[增加 减小] 类型:转载 时间:2009-12-28我要评论 Jquery中$ ...

  6. $(document).ready() 、 $('#id').load() 、window.onload 的区别

    今天做项目的时候遇到一个问题,结果死在了$(document).ready(). $('#id').load() .window.onload的区别上.然后,就整理一下,这三者的区别. 参考文章:ht ...

  7. body里面的onload和window.onload的区别

    区别:body里面的onload是在“页面加载完成后执行的动作” window里面的onload是在“页面加载时执行的动作” 例子:在html页面中有一个大图片,想要在图片显示出来后提示一个消息框“图 ...

  8. jQuery中的$(window).load()与$(document).ready()以及jquery $(document).ready() 与window.onload的区别

    大多数jQuery实例或教程都告诉我们绑定我们的jQuery代码到$(document).ready事件.虽然$(document).ready 事件在大多数情况下都OK,但是它的解析顺序是在文档准备 ...

  9. 深入理解,函数声明、函数表达式、匿名函数、立即执行函数、window.onload的区别.

    一.函数声明.函数表达式.匿名函数1.函数声明:function fnName () {…};使用function关键字声明一个函数,再指定一个函数名,叫函数声明. 2.函数表达式 var fnNam ...

随机推荐

  1. OpenCV学习:Mat结构中的数据共享机制

    使用Mat类,内存管理变得简单,不再像使用IplImage那样需要自己申请和释放内存. Mat是一个类,由两个数据部分组成:矩阵头(包含矩阵尺寸,存储方法,存储地址等信息)和一个指向存储所有像素值的矩 ...

  2. 使用Dreamweaver开发php

    1.新建站点,开发的目录 2.服务器,服务器的目录   (并修改为“测试”) 3.必须结合WANP5

  3. 单行dp复习hdu1087

    我写的想法是每个dp[i]都是前dp[i]的最大值 dp[i]就等于前全部dp[0...i-1]的最大值加上dp[i] 最大值是一个中间变量 最大值得选取条件就是序列的值大小都是递增的,也就是a[i] ...

  4. 解决IE中img.onload失效的方法

    解决IE中img.onload失效的方法 - CoffeeCat's IT Blog - IT博客 http://www.cnitblog.com/CoffeeCat/archive/2008/02/ ...

  5. div位置设置

    div居中显示 margin:0 auto div中的内容居中显示 text-algin:center div靠右显示 float:right 设置div元素的右外边距 margin-right:10 ...

  6. Centos下Nagios的安装与配置

    一.Nagios简介 Nagios是一款开源的电脑系统和网络监视工具,能有效监控Windows.Linux和Unix的主机状态,交换机路由器等网络设置,打印机等.在系统或服务状态异常时发出邮件或短信报 ...

  7. linux的setup命令设置网卡和防火墙等

    以前在centos上配置网卡都是纯命令行,今天发现linux原来还有一个setup那么好用的命令,真是相见恨晚,以后防火墙.网卡.其他网络配置.系统配置(开机启动项)都可用他来完成了

  8. poj_2286 线段树

    题目大意 在墙上贴海报,墙壁是由一排连续的瓷砖铺成,海报贴在墙壁上必须占据连续的几块瓷砖,海报可以互相覆盖,问最后可以看见几张海报(未被完全覆盖). 题目分析 墙壁是由连续的一个区间构成,每个海报占据 ...

  9. ubuntu 关闭显示器的命令

    sleep 2s ; gnome-screensaver-command -a或sleep 2s ; xset dpms force off2秒后关闭显示器

  10. 最短路和次短路的条数(dijstra算法或spfa算法)POJ3463

    http://poj.org/problem?id=3463 Sightseeing Time Limit: 2000MS   Memory Limit: 65536K Total Submissio ...