.ready()函数是jQuery中最常用的函数之一，它是jQuery基于页面加载情况执行任务的主要方式。$(document).ready()表示页面（DOM）加载就绪后立即执行.ready()函数内的内容。

JavaScript原生window.onload事件也可以实现相同的功能，但是它们之间也存在的明显的差异：

• window.onload事件会在文档所有资源完全下载到浏览器中之后触发，这意味着所有关联文件（例如所有的图片）等资源全部下载完毕后才会触发window.onload事件。

• .ready()函数会在HTML文档下载到浏览器并生成DOM后执行，这意味着不必等到所有内容（例如图片）都下载完毕，只要DOM树就绪后就可以执行。

以上区别在页面内容较为复杂的情况下就会显现出明显的差别，相对而言，使用.ready()函数执行效率更高，因为不必等待关联文件的下载就可以执行。但是如果涉及对图片高度、宽度等属性的操作，那么使用window.onload事件更为妥当，因为必须等到图片确实可用才能进行这样的操作。

使用.ready()函数比使用window.onload事件还有一个好处，那就是可以在同一个页面中添加执行多个脚本。

使用JavaScript注册事件的一个例子如下：

function doIt() {
    alert('It works!');
}
window.onload = doIt;

以上代码中定义了函数doIt,当他执行时会显示一个警告框“It works!”，将它赋值给window.onload后，就会在页面加载完成后执行这个doIt函数。

问题是如果想在页面加载后再执行一个其他函数，当再讲其他函数赋值给window.onload，那么后赋值的函数就会覆盖前面的函数，因为window.onload只能接收一个值。

而通过$(document).ready()则可以很好的解决这个问题，将需要执行的所有函数放入.ready()后，它们都会按照注册它们的顺序依次执行。

/*******************/
/* 定义被调用的函数 */
/*******************/

function doIt1() {
    alert('doIt1 works!');
}
function doIt2() {
    alert('doIt2 works!');
}
function doIt3() {
    alert('doIt3 works!');
}

/**************************************/
/* 在$(document).ready()中调用以上函数 */
/**************************************/

$(document).ready(function () {
    doIt1();
    doIt2();
});
$(document).ready(function () {
    doIt3();
});

以上代码中，分别定义了doIt1、doIt2、doIt3三个函数，然后在两个$(document).ready()中分别调用，当DOM就绪后，上述三个函数就会依次执行。