$(window).load与$(document).ready的区别

`$(window).load` 和 `$(document).ready` 都是 jQuery 提供的方法，用于在页面加载完成后执行一些 JavaScript 代码。它们的区别在于执行的时机不同。

`$(document).ready` 会在 DOM 加载完成后立即执行，不必等待其他资源的加载完成。这意味着它可以更快地执行 JavaScript 代码。通常情况下，我们使用 `$(document).ready` 来绑定一些事件、修改 DOM 或者执行其他的操作。

`$(window).load` 则会等到所有资源都加载完成后才会执行，包括图片、CSS、JavaScript 等。这意味着它会比 `$(document).ready` 更慢，但是它可以确保所有的资源都已经加载完成，这对于某些操作是必须的。例如，如果你需要获取图片的真实宽度和高度，那么就必须等待图片加载完成后才能进行计算。

总之，`$(document).ready` 更快，适合大多数情况下的操作；而 `$(window).load` 更慢，但是更可靠，适合需要等待所有资源加载完成后才能进行的操作。

相关问题

[转]JQ中$(window).load和$(document).ready区别与执行顺序

在jQuery中，$(window).load()和$(document).ready()都是用来执行代码的方法。它们的区别在于执行的时间和执行的内容。下面是它们的详细解释：

1. $(document).ready()

$(document).ready()方法是在DOM加载完成后就立即执行的。也就是说，它会在整个页面的HTML结构加载完成后就执行，不用等待图片、视频等其他资源加载完成。因此，如果你的代码只需要操作DOM元素，而不关心其他资源的加载情况，那么$(document).ready()就足够了。

2. $(window).load()

$(window).load()方法是在整个页面以及所有外部资源都加载完成后才执行的。也就是说，它会等待页面上所有的图片、视频等资源都加载完成后才执行。因此，如果你的代码依赖于其他资源的加载情况，那么$(window).load()就更为合适。

3. 执行顺序

在执行顺序方面，$(document).ready()会先于$(window).load()执行。因为$(document).ready()只需要等待DOM结构加载完成就可以执行，而$(window).load()需要等待所有资源加载完成后才能执行。

另外，由于$(document).ready()方法是在DOM结构加载完成后就执行的，所以它的执行速度非常快，几乎可以忽略不计。而$(window).load()方法则需要等待所有资源加载完成后才能执行，因此它的执行速度会比$(document).ready()慢得多。

$(window).load()事件用法

`$(window).load()`事件是在所有页面资源都已经加载完成后触发的事件，与`window.onload`事件类似。它是jQuery库提供的一个事件，可以用来执行一些需要等待所有资源加载完成后才能进行的操作。

`$(window).load()`事件的用法如下：

$(window).load(function() {
  // 所有页面资源都已经加载完成后执行的代码
});

在这个事件中，可以进行一些需要等待所有资源加载完成后才能进行的操作，例如操作图片、计算元素的位置、执行动画效果等等。

需要注意的是，`$(window).load()`事件触发的时间比`$(document).ready()`事件（或者说DOMContentLoaded事件）要晚，因为它需要等待所有资源加载完成后才能触发。因此，如果只需要操作DOM元素，就可以使用`$(document).ready()`事件或者DOMContentLoaded事件，如果需要操作图片等资源，可以使用`$(window).load()`事件。

另外，从jQuery 3.0版本开始，`$(window).load()`事件已经被废弃，建议使用`$(window).on('load', function(){})`来代替。