细说document.ready和window.onload

document.ready是Jquery提供的一个函数，用于在文档加载完成后执行一些代码。它相当于javascript中的window.onload，但有一些区别。
1. 执行时机：
- document.ready：在DOM树构建完成后即可执行，不需要等待外部资源（如图片）加载完成。
- window.onload：需要等待页面的所有资源加载完成后才能执行，包括外部资源和图片等。
2. 代码书写：
- document.ready：使用jQuery库中的函数，代码可以直接写在一个回调函数中。
- window.onload：需要在JavaScript中使用事件监听的方式来写，或者在html中直接调用一个函数。
3. 多次调用：
- document.ready：可以多次调用，每次调用都会将新的函数添加到执行队列中。
- window.onload：只能在页面加载时调用一次，多次调用会覆盖之前的事件。
4. 兼容性：
- document.ready：依赖于jQuery库，只能在引入了jQuery库的页面中使用。
- window.onload：原生JavaScript事件，几乎在所有浏览器中都可以使用。
5. 执行顺序：
- document.ready：多个document.ready函数会按照调用顺序依次执行。
- window.onload：多个window.onload函数会按照调用顺序依次执行。
总的来说，document.ready更适合在DOM加载完成后执行一些操作，比如绑定事件、修改DOM元素等。而window.onload更适合在页面所有资源加载完成后执行一些操作，比如初始化一些需要依赖资源的组件、发送网络请求等。