window.onload vs document.ready jQuery

Question

我有一个包含两列的网站。我希望在使用jQuery时都有相同的高度。

我正在尝试获取徽标列高度。我有：

$(document).ready(function() {
    alert($('#logo').height());
});​

它不起作用。所以我把它改成了：

window.onload = function(){
    alert($('#logo').height());
}

它正在发挥作用。这里发生了什么？

Answer 1

加载DOM时会触发

document ready，因此高度等信息不可用，除非明确声明。

window onload等待页面中的资源完全加载 - 现在可以使用高度等信息。

Answer 2

我在处理$（文档）中的图像高度和宽度时遇到了同样的问题，我找到了一些更好的参考来解决它...我希望这可能有助于某些人

<强> $（文件）。就绪（）

加载HTML文档并且DOM准备好时，即使所有图形尚未加载，也会触发文档就绪事件。如果你想在加载窗口之前连接某些元素的事件，那么$（document）.ready就是正确的位置。

<强>代码：

$(document).ready(function() {
    // document is loaded and DOM is ready
    alert("document is ready");
});

<强> $（窗口）.load（）

当完整页面完全加载时，窗口加载事件稍后会触发，包括所有帧，对象和图像。因此，涉及图像或其他页面内容的函数应放在窗口或内容标记本身的加载事件中。

<强>代码：

$(window).load(function() {
    // page is fully loaded, including all frames, objects and images
    alert("window is loaded");
});