浏览器渲染时 首先解析DOM结构 (同时在发送请求 去请求其他资源 比如图片 视频 等 ) DOM结构解析完毕 这个时候jQuery看准时机在这里添加了监听 所以Ready方法执行很早,可能会引起其他插件没有加载而在ready(handler)中使用引发错误,其后渲染图片 样式 计算页面布局等 这一块相对的耗时比较长,全部结束后出发了window.onload事件

<html>
<head>
<meta charset="utf-8">
<title>demo</title>
</head>
<body>

</body>
<script src="jquery.js"></script>
<script>
window.onload = function () {
alert('onload');

};

$(document).ready(function(){
alert('ready');
});
</script>
</html>

  这个代码可以看出先执行ready,在执行window.onload事件

<html>
<head>
<meta charset="utf-8">
<title>demo</title>
</head>
<body> </body>
<script src="jquery.js"></script>
<script> var sayHi1;
var sayHi1 = function(){
alert("sayHi1");
}
sayHi1();
$(document).ready(function(){
var sayHi = function(){
alert("kaishi ");
}
sayHi();
});
</script>
</html>

  这个代码是先弹出sayHi1,再弹出kaishi

window.onload 和doucument.ready执行顺序的更多相关文章

  1. js常见执行方法window.onload = function (){},$(document).ready()

    1. window.onload = function(){}; 当页面DOM对象加载完毕,web浏览器能够运行JS时,此方法即被触发. 2. $(document).ready();当web页面以及 ...

  2. window.onload与$(document).ready()区别

    2013-12-08 17:11:34 window.onload一次只能执行一个程序,而$(document).ready()可以按照先后顺序执行多个程序. eg: function one(){ ...

  3. window.onload和$(document).ready()比较

    浏览器在页面加载完毕后,JS通常使用window.onload方法为DOM元素添加事件,而jQuery使用的是$(document).ready()方法.两者功能相似,但也有细微差异,下面简要对比一下 ...

  4. window.onload和document.ready的区别

    window.onload和document.ready虽然两个方法的运行效果都一样,但他们之间是存在着区别的: 一.从执行的时间 window.onload在dom文档结构加载完毕以后就可以执行,不 ...

  5. window.onload和$(document).ready(function(){})的区别

    前段时间在面试之前查找并整理了一下window.onload和$(document).ready(function(){})区别,今天有时间更到我的博客上,由于本人资历尚浅,如有不对的地方,还请指正. ...

  6. window.onload和$(document).ready()的区别

    window.onload和$(document).ready()的区别,如下表所示   window.onload $(document).ready() 执行时间 在页面所有内容(图片.文件)加载 ...

  7. JS ——window.onload与$(document).ready()

    我们常常在页面加载完成以后做一些操作,比如一些元素的显示与隐藏.一些动画效果.我们通常有两种方法来完成这个事情,一个就是window.onload事件,另一个就是JQuery的ready()方法.那么 ...

  8. 菜鸟学JS(五)——window.onload与$(document).ready()

    我们继续说JS,我们常常在页面加载完成以后做一些操作,比如一些元素的显示与隐藏.一些动画效果.我们通常有两种方法来完成这个事情,一个就是window.onload事件,另一个就是JQuery的read ...

  9. window.onload()与$(document).ready()区别

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

随机推荐

  1. C#反射回顾笔记

    一 .反射概述 反射提供描述程序集.模块和类型的对象(Type 类型). 可以使用反射动态地创建类型的实例,将类型绑定到现有对象,或从现有对象中获取类型,然后调用其方法或访问其字段和属性. 如果代码中 ...

  2. python学习笔记-电子书

    程序输入和raw_inoput() 内建函数 字符解释 f% :对应小数 >>> print "%s is number %d" % ("python& ...

  3. 【Leetcode_easy】617. Merge Two Binary Trees

    problem 617. Merge Two Binary Trees     参考 1. Leetcode_easy_617. Merge Two Binary Trees; 完    

  4. git 平时遇到的问题记录

    1.git warning: LF will be replaced by CRLF in 解决办法 git config core.autocrlf false 2.git提交时如何忽略一些文件 h ...

  5. 手写C++代码实现POST传输数据

    char *pHttpPost = "POST %s HTTP/1.1\r\n" "Host: %s:%d\r\n" "Content-Type: a ...

  6. Oracle数据同步交换

    一.为了解决数据同步汇聚,数据分发,数据转换,数据维护等需求,TreeSoft将复杂的网状的同步链路变成了星型数据链路.     TreeSoft作为中间传输载体负责连接各种数据源,为各种异构数据库之 ...

  7. Laravel用户认证系统的实现细节

    原文地址:http://www.php.cn/php-weizijiaocheng-406076.html 这篇文章主要介绍了关于Laravel用户认证系统的实现细节,有着一定的参考价值,现在分享给大 ...

  8. vue+element-ui 实现table单元格点击编辑,并且按上下左右键单元格之间切换

    通过我的测试我发现两个两种方法来编辑单元格的内容 第一种点击编辑: 我是给td里添加一个input,将值赋值给input,当失去焦点的时候将input的值付给td原来的内容,然后将input删除, 代 ...

  9. [官网]Windows 10 版本信息

    对应于服务选项的 Windows 10 当前版本 https://docs.microsoft.com/zh-cn/windows/release-information/ 所有的日期都按照 ISO ...

  10. Java基础---Java 开发工具IntelliJ IDEA 安装

    1.1 开发工具概述IDEA是一个专门针对Java的集成开发工具(IDE),由Java语言编写.所以,需要有JRE运行环境并配置好环境变量.它可以极大地提升我们的开发效率.可以自动编译,检查错误.在公 ...