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. 利用curl计算网络文件大小

    ; CURL *handle = curl_easy_init(); curl_easy_setopt(handle, CURLOPT_URL, url); curl_easy_setopt(hand ...

  2. C# 读取文本文档(转)

    1.添加命名空间 System.IO; System.Text; 2.文件的读取 (1).使用FileStream类进行文件的读取,并将它转换成char数组,然后输出. byte[] byData = ...

  3. sqlserver mdf向上兼容附加数据库(无法打开数据库 'xxxxx' 版本 611。请将该数据库升级为最新版本。)

    最近工作中有一个sqlserver2005版本的mdf文件,还没有log文件,现在需要 附加到sqlserver2012,经过网上一顿搜索,把完整的过程奉上,供大家参考 首先创建数据库 再设置数据库的 ...

  4. 利用URLScan工具过滤URL中的特殊字符(仅针对IIS6)-- 解决IIS短文件名漏洞

    IIS短文件名漏洞在windows服务器上面非常常见,也就是利用“~”字符猜解暴露短文件/文件夹名,比如,采用这种方式构造URL:http://aaa.com/abc~1/.aspx,根据IIS返回的 ...

  5. html5的发展历程

    20年磨一剑,HTML5作为下一代Web标准,她的语义之美.人性之美.简单之美.实用之美……如同一场革命,将Web从内容平台推向标准化的应用平台,并一统各在平台阵营的标准.2008年,HTML5发布首 ...

  6. 关于kafka连接不上别的机器问题Connection refused

    1.确认config里面的server.properties 正确(包括IP+端口2181记得看清,用hostname的话记得etc/hostnames下面查看全部配置上没,建议用hostname方便 ...

  7. Android——GridView(显示文字)

    activity_test9的layout文件: <?xml version="1.0" encoding="utf-8"?> <Linear ...

  8. 【HNOI2004】【P1365】L语言

    tire水题,%Menci 原题: 标点符号的出现晚于文字的出现,所以以前的语言都是没有标点的.现在你要处理的就是一段没有标点的文章.一段文章T是由若干小写字母构成.一个单词W也是由若干小写字母构成. ...

  9. Draw a Border around any C# Winform Control

    public class MyGroupBox : GroupBox { protected override void OnPaint(PaintEventArgs e) { base.OnPain ...

  10. 黑马程序员——JAVA基础之List集合

    ------- android培训.java培训.期待与您交流! ---------- Collection : |--List:元素是有序的,元素可以重复.因为该集合体系有索引.         | ...