document.ready和onload的区别——JavaScript文档加载完成事件

页面加载完成有两种事件
一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件)
二是onload,指示页面包含图片等文件在内的所有元素都加载完成。
 
用jQ的人很多人都是这么开始写脚本的:
$(function(){
// do something
});
其实这个就是jq ready()的简写,他等价于:
$(document).ready(function(){
//do something
})
//或者下面这个方法,jQuer的默认参数是:“document”;
$().ready(function(){
//do something
})
这个就是jq ready()的方法就是Dom Ready,他的作用或者意义就是:在DOM加载完成后就可以可以对DOM进行操作。
一般情况先一个页面响应加载的顺序是:域名解析-加载html-加载js和css-加载图片等其他信息。
那么Dom Ready应该在“加载js和css”和“加载图片等其他信息”之间,就可以操作Dom了。
 
 
1.window.onload方法
 
⑴执行时机:
在网页中所有元素(包括元素的所有关联文件)完全加载到浏览器后才执行,即JavaScript 此时可以访问网页中的所有元素。
window.onload=function(){  $(window).load(function(){
//编写代码 等价于  //编写代码
}  });
 
⑵多次使用:
JavaScript的onload事件一次只能保存对一个函数的引用,他会自动用最后面的函数覆盖前面的函数。

function one(){

alert("one");

}

function two(){

alert("two");

}

window.onload=one;

window.onload=two;

//运行代码后只有 two

2.$(document).ready()方法
 
⑴执行时机:在DOM完全就绪时就可以被调用。(这并不意味着这些元素关联的文件都已经下载完毕)
举个例子:$(document).ready()方法明知要DOM就绪就可以操作了,不需要等待所有图片下载完毕。
 
⑵多次使用:

function one(){

alert("one");

}

function two(){

alert("two");

}

$(document).ready(function(){

one();

});

$(document).ready(function(){

two();

});

随机推荐

  1. Why does my ListView scroll to the top when navigating backwards?

    I’ve seen a few people asking this question. They have a page which contains a ListView and when an ...

  2. 多个Tomcat同时运行环境配置 - imsoft.cnblogs

    解压下载好的Tomcat压缩包,两次.此例中分别命名为tomcat和tomcat2. 1. 在MyEclipse中配置好第一个Tomcat环境,可以正常运行项目后. 2. 再配置tomcat2这个项目 ...

  3. Kmeans算法的应用实例(Matlab版本)

    K-means是一种经典的聚类算法,是十大经典数据挖掘算法之一.K-means算法的基本思想是:以空间中k个点为中心进行聚类,对最靠近他们的对象归类.通过迭代的方法,逐次更新各聚类中心的值,直至得到最 ...

  4. jsoup的elements类

    jsoup的Elements类 一.简介 该类是位于select包下,直接继承自Object,所有实现的接口有Cloneable, Iterable<Element>, Collectio ...

  5. tyvj1012 P1012 - 火柴棒等式 ——暴力枚举

    题目链接:https://www.tyvj.cn/Problem_Show.aspx?id=1012 可以发现:最大的数字绝对不超过999,只要枚举出0-999所有数字需要的火柴数,然后再枚举C和A, ...

  6. python3获取当前目录(转)

    转自:http://www.elias.cn/Python/GetPythonPath?from=Develop.GetPythonPath 1.  以前的方法 如果是要获得程序运行的当前目录所在位置 ...

  7. Codeforces Round #133 (Div. 2)

    A. Tiling with Hexagons 看成大三角形扣去3个小三角形. B. Forming Teams 由于每个点的度数不超过2,所以最后每个点要么在一条链上要么在一个环上. 在环上的话,每 ...

  8. codeforces 725/C

    Hidden Word time limit per test 2 seconds memory limit per test 256 megabytes input standard input o ...

  9. phpwind8.7升级9.0.1过程(二)8.7正式升级9.0

    首先备份 1. 给本地做备份将网站根目录下面的所有文件先做备份. 2. 给本地数据库做备份 3. 了解升级的具体过程 phpwind8.7升级到9.0需要首先升级到phpwind9.0的原生版本即:2 ...

  10. linux设备驱动程序该添加哪些头文件以及驱动常用头文件介绍(转)

    原文链接:http://blog.chinaunix.net/uid-22609852-id-3506475.html 驱动常用头文件介绍 #include <linux/***.h> 是 ...