Question

JS 页面加载触发事件 document.ready和onload的区别

Answer 1

1. document.ready是jquery提供的，正确的写法如下：

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

因为这么些比较麻烦，所以一般使用简写的方式，如下：

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

2. 关于document.ready与onload的相同点：都是在页面加载完成后执行方法体中的代码；不同点：document.ready可以绑定多个函数，js根据定义的顺序，依次执行各个方法体，onload不能定义多个，后面定义的会覆盖前面定义的，所以只会执行最后定义的方法。

$(function(){
    // 方法体1，页面加在后执行
});
$(function(){
    // 方法体2，方法体1执行后执行
});

window.onload = function(){
    // onload方法1
};
window.onload = function(){
    // onload方法2，页面加载完成后执行，不会执行onload方法1
    
}