有关js页面加载的一些解析，load和ready

用jQuery的大多数开始都是这么写脚本的

$(function(){    //....code....});

比如：

$(function(){        $("#btn1").click({                $("div").fadeIn(3000);        });});

上面这个代码就是在给id为btn1的按钮绑定了一个事件，这个事件就是在页面加载时完成绑定，然后等待事件的触发。

上面的就是下面的简写，等于：

$(document).ready(function(){    //......code......});

或

$().ready(function(){    //.......code....});

这个方法就是DOM Ready，意思就是在DOM加载完成后就可以对DOM进行操作。

一般页面加载的顺序是：

域名解析–>加载HTML–>加载js和css–>加载图片等信息

所以这个方法一般是在加载[js和css]和[加载图片等信息]之间就可以操作DOM。

当我们用原生的js的时候一般用onload来做一些事情，比如：

window.onload=function(){    //........code.......}

或者用一个图片，比如：

document.getElementById("imgID").onload=function(){ //........code.......}

这就是DOM load(不是jQuery的load()方法)，它的作用就是在document文档加载完成后就可对DOM进行操作，比如一个网页整个加载完成就可以对这个网页进行操作。

上面ready和load说明就是：

ready是在DOM加载完成后就可以对DOM 进行操作，而不用等待整个页面加载完成。

load是在整个文档加载完成后才可以对页面进行操作，比如一张图片你要等待这个图片加载完成才可以对这个图片进行操作。

---

上面提了下jQuery的load方法，感觉这需要记录下：

jQuery load()方式是一个简单强大的ajax方法。

load()从服务器获取数据，并把返回的数据放入被选元素中。

语法：

$(selected).load(URL,data,callback);

其中：

• URL是必须有的，剩下连个是可选的，callback参数是load()方法执行完后要他去执行的函数。
  比如：

//这个就是将txt文件中的test文本读取的内容加载到id为div1的DIV中$("#div1").load("txt/test.txt");

带回调函数的：

$("#btn").click(function(){    $("#div1").load("txt/text.txt",function(responseTxt,statusTxt,xhr){        if(statusTxt=="success"){            alert("加载成功");            alert(responseTxt);        }        if(statusTxt=="error"){            alert("error:"+xhr.status+":"+xhr.statusTxt);        }    });});

上面代码中：
- responseTxt:包含调用成功时的结果内容
- statusTxt:包含调用状态
- xhr:包含XMLHttpRequest对象。