$(document).ready()与window.onload的区别(转发)
1.执行时间
window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。
$(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕。
2.编写个数不同
window.onload不能同时编写多个,如果有多个window.onload方法,只会执行一个
注视:除非通过对onload事件进行卸载重新添加事件的方式添加多个需要执行的方法,示例如下:
var obj = document.body.onload;//获取已注册的执行事件
document.body.onload = function() { return false; };//卸载onload事件
window.attachEvent("onload", obj);//重新注册
attachEvent注册的事件按照先注册后执行规则
window.attachEvent("onload", function() {
objInit2(par1,par2); });//注册新事件
$(document).ready()可以同时编写多个,并且都可以得到执行
3.简化写法
window.onload没有简化写法
$(document).ready(function(){})可以简写成$(function(){});
另外,需要注意一点,由于在$(document).ready() 方法内注册的事件,只要DOM 就绪就会被执行,因此可能此时元素的关联文件未下载完。例如与图片有关的html 下载完毕,并且已经解析为
DOM 树了,但很有可能图片还没有加载完毕,所以例如图片的高度和宽度这样的属性此时不一定有效。
要解决这个问题,可以使用Jquery 中另一个关于页面加载的方法---load() 方法。
Load() 方法会在元素的onload 事件中绑定一个处理函数。如果处理函数绑定给window 对象,则会在所有内容( 包括窗口、框架、对象和图像等) 加载完毕后触发,如果处理函数绑定在元素上,则会在元素的内容加载完毕后触发。
Jquery 代码如下:
$(window).load(function (){
// 编写代码
});
等价于
JavaScript 中的以下代码
Window.onload = function (){
// 编写代码
}
随机推荐
- linux字体安装
Google查了一下,果然Windows下的ttf字体与GNOME是兼容的!我立即确定了我的方案——使用Windows下的“微软雅黑”体作为桌面和应用程序的默认字体! 1. 首先获得一套“微软雅黑”字 ...
- hdu1020Encoding
Problem Description Given a string containing only 'A' - 'Z', we could encode it using the following ...
- C语言基础10
栈区间:在函数内部声明的变量都存放在栈区间,比如int char 数组 结构体 指针,只管申请,系统会自动帮我们回收,收回的时间是作用域结束之后,遵循的原则是"先进后出". int ...
- 编译安装httpd
一.安装前的说明: httpd依赖于apr和apr-util所以在安装httpd之前要把这些东西都安装上去. 事先安装的依赖: yum -y install gcc gcc-c++ pcre-deve ...
- Django的痛点
如果一个html里面写了多个<a href = A.html > ,启动A.html也有这个<a herf = B.xml> 这个时候Django怎么访问这些url?
- WPF笔记(1.6 数据绑定)——Hello,WPF!
原文:WPF笔记(1.6 数据绑定)--Hello,WPF! 这个一节都是在讲一个数据绑定的示例.功用:输入姓和名,点击Add按钮,ListBox增加一条记录,永远是字符串“name: nick”:L ...
- zhihu spark集群,书籍,论文
spark集群中的节点可以只处理自身独立数据库里的数据,然后汇总吗? 修改 我将spark搭建在两台机器上,其中一台既是master又是slave,另一台是slave,两台机器上均装有独立的mongo ...
- Linux系统编程(12)——shell基础
Shell的作用是解释执行用户的命令,用户输入一条命令,Shell就解释执行一条,这种方式称为交互式(Interactive),Shell还有一种执行命令的方式称为批处理(Batch),用户事先写一个 ...
- 贝塞尔曲线:原理、自定义贝塞尔曲线View、使用!!!
一.原理 转自:http://www.2cto.com/kf/201401/275838.html Android动画学习Demo(3) 沿着贝塞尔曲线移动的Property Animation Pr ...
- 剑指offer-面试题6.重建二叉树
题目:输入某二叉树的前序遍历和中序遍历结果,请重建出该二叉树.假设 输入的前序遍历和中序遍历的结果都不含重复的数字.例如输入前序遍历 序列{1,2,4,7,3,5,6,8}和中序遍历序列{4,7,2, ...