jQuery $(document).ready()的用法（新手必看）

$(document).ready() 是事件模块中最重要的一个方法，它极大地提高了 Web 响应速度。

(document).ready() 方法用于获取整个文档对象，从这个方法的名称来理解，该方法就是用于获取就绪的文档。$(document).ready() 方法的书写格式为：

$(document).ready(function(){
    // 在这里写代码
});

可以简写成：

$().ready(function(){
    // 在这里写代码
});

当 $() 不带参数时，默认的参数就是 document，所以 $() 是 $(document) 的简写形式。还可以进一步简写成：

$(function(){
    // 在这里写代码
});

虽然语法形式可以更短一些，但是不提倡使用简写形式，因为较长的代码更具有可读性，也可以防止与其他方法混淆。

通过上面的介绍可以看出，在 jQuery 中，可以使用 $(document).ready() 方法代替传统的 window.onload() 方法，不过两者之间还是有些细微区别的，主要表现在：
1) 在一个页面中可以无限次地使用 $(document).ready() 方法，各个方法间并不冲突，且各个方法会按照在代码中的顺序依次执行。而 window.onload() 方法在一个页面中只能使用一次。

2) 当一个文档（包括所有关联的文件，如图片、横幅等）完全加载到浏览器时，就会执行 window.onload() 方法。而 (document).ready() 方法在所有的 DOM 元素（不包括关联的文件）完全就绪以后就可以执行。

例如，在页面中还有图片没有加载完毕但是 DOM 元素已经完全就绪时，就会执行 (document).ready() 方法，在相同条件下 window.onload() 方法是不会执行的，它会继续等待图片加载，直到图片及其他的关联文件都加载完毕时才执行。

显然，把网页解析为 DOM 元素的速度比把页面中的所有关联文件加载完毕的速度快得多。

但是，在使用 $(document).ready() 方法时要注意一点，因为只要 DOM 元素就绪就可以执行该方法，所以可能出现元素的关联文件尚未加载完毕的情况。例如，与图片有关的 DOM 元素已经就绪，但是图片还没有加载完毕，若此时获取图片的高度或宽度属性未必会有效。要解决这个问题，可以使用 jQuery 中的另一个关于页面加载的方法：load() 方法。

load() 方法会在元素的 onload 事件中绑定一个处理函数，如果这个处理函数绑定在 window 对象上，则会在所有内容加载完毕后触发；如果绑定在元素上，则会在元素的内容加载完毕后触发。

具体代码如下：

$(window).load(function(){
    // 在这里写代码
});

以上代码等价于：

window.onload = function(){
    // 在这里写代码
};