为了理解2个事件的异同，先了解一下HTML文档加载顺序
HTML DOM文档加载步骤
HTML DOM文档加载是按顺序执行的，这与浏览器的渲染方式有关，一般浏览器渲染操作的顺序大致按如下几个步骤
1, 解析HTML结构
2,加载外部脚本和样式表文件
3,解析并执行脚本代码
4,构造HTML DOM模型
5,加载图片等外部文件
6,页面加载完毕
执行时机
load 事件必须等到页面中所有内容全部加载完毕之后，才被执行，如果一个页面中包含了大数据的多媒体文件，则就会出现页面文档已经呈现出来，二由于网页数据还没有完全加载完毕，导致load事件不能够即使被触发。使得网页呈现和脚本初始化配置不能保存同步，从而影响了页面的可用性。
而jQuery的ready是在DOM结构绘制完毕之后就执行，也就是说它先于外部文件的加载就被执行了，这样就能确保文档的呈现和脚本初始化保持同步。
总之，ready事件先于Load事件被激活，如果网页文档中没有加载外部文件，则他们的响应时间基本上是相同的。
编写个数
JavaScript的load事件只能够被编写一次，下面的写法是不允许的，此时他仅仅能够影响最后一次指定的事件处理函数，
<script type = 'text/javascript'>
window.onload = function(){
alert('页面初始化1');
}
window.onload = function(){
alert('页面初始化2');
}
window.onload = function(){
alert('页面初始化3');
}
</script>
如果希望这3个事件处理函数中的代码都被执行，则应该吧他们包含在一个处理函数中。
<script type = 'text/javascript'>
var f1 = function() {
alert("页面初始化1");
}
var f2 = function() {
alert("页面初始化2");
}
var f3 = function() {
alert("页面初始化3");
}
window.onload = function(){
f1();
f2();
f3();
} </script>
而对于JQuery 的ready事件类型来说，我们可以在同一个文档中多次定义，例如
<script src = "jquery.1.8.2.js" type = "text/javascript"> </script>
<script type = "text/javascript">
$(function() {
alert("页面初始化1");
});
$(function() {
alert("页面初始化2");
});
$(function() {
alert("页面初始化3");
});
</script>
这对于复杂页面中多次配置初始化程序非常重要，这样方便了用户根骨需要进行设计
参考自《jquery开发完全技术宝典》