`

jquery的$(document).ready()与window.onload区别

阅读更多

jquery中的$(document).ready()与window.onload的区别

最早接触的时候也说$(document).ready(function(){   })这个函数是用来取代页面中的window.onload;

但是今天发现 好像不是这样回事!是在做一个页面载入效果时发现的!

function winready(){document.getElementById("loading").style.display="none";}
window.onload=winready;
以上的写法  winready会在页面完全载入才触发;

jquery写法:
$(document).ready(function(){
"#loading").css("display","none");
})

以前没发现,今天因为网络卡,发现一个页面的一张图片还没载入完成,jquery的ready函数就已经触发了!

document.onload  window.onload <body onLoad="winready()">

到底又没区别?

解释这样!

$(document).ready()是在DOM结构载入完后执行的,而window.onload是得在所有文件都加载完后执行的,注意区别,一个是DOM加载完,一个是所有文件加载完

所谓DOM加载完,就是指DOM模型加载完,也就是指代码加载完。
两者最大的区别,就是DOM加载完之后,不必再去等相应的图片加载完就可以执行JS代码了。
分享到:
评论
2 楼 zhangxpower 2011-07-26  
恩,有.我试过了.
1 楼 lybykw 2011-07-26  
有这等事?

相关推荐

    jQuery(document).ready(function($) { });的几种表示方法

    **第五种:jQuery的`$(document).ready()`与`window.onload()`的区别** - `$(document).ready()`在DOM元素加载完毕后立即执行,不需要等待所有资源(如图片、CSS等)加载完成。 - 相比之下,`window.onload()`需要...

    jquery的$(document).ready()和onload的加载顺序

    在JavaScript和jQuery的世界里,了解`$(document).ready()`和`window.onload`的加载顺序是非常重要的,尤其是在处理页面加载和交互效果时。这两个事件都与页面加载有关,但它们触发的时机有所不同,这也可能导致在...

    全面解析jQuery $(document).ready()和JavaScript onload事件

    在描述中提到,$(document).ready()仅执行一次,并且它和JavaScript的onload事件有着本质的区别。$(document).ready()只关注DOM元素是否已加载,而不是整个页面所有资源都加载完毕。这个方法非常适合用来初始化页面...

    jQuery之$(document).ready()使用介绍

    与window.onload的区别 $(document).ready()不同于window.onload。window.onload是在整个页面(包括所有的依赖资源如图片、样式表等)加载完成后才会执行。它更适合用于执行依赖于外部资源完全加载的任务,例如计算...

    $(document).ready(function() {})不执行初始化脚本

    3. 如果可能,尝试将`$(document).ready()`中的代码移至`window.onload`事件中,看看是否能正常执行,以确定问题是否与DOM加载有关。 4. 如果有多个库在使用`$`,考虑使用`jQuery.noConflict()`来避免冲突。 通过...

    浅析document.ready和[removed]的区别讲解

    本文将深入探讨`document.ready`和`window.onload`这两个事件的区别。 `document.ready`是jQuery库提供的一种方法,它的全称是`$(document).ready()`,它的主要作用是在DOM结构构建完成,但图像或其他资源可能尚未...

    JQuery下关于$.Ready()的分析

    $(document).Ready()方法 VS OnLoad事件 VS $(window).load()方法 接触JQuery一般最先学到的是何时启动事件。在曾经很长一段时间里,在页面载入后引发的事件都被加载在”Body”的Onload事件里. 对于Body的Onload事件...

    jquery $(document).ready()和[removed]的区别浅析

    两者的用法在很多情况下非常相似,但它们之间也存在一些关键的区别,以下就是$(document).ready()和window.onload的区别浅析。 1. 执行时间上的区别 $(document).ready()方法仅需要DOM元素全部加载完成即可执行,这...

    jquery $(document).ready() 与[removed]的区别

    传统的JavaScript通过window.onload方法来实现此功能,而在jQuery中,则主要使用$(document).ready()方法。虽然这两个方法在功能上相似,都是确保在页面的HTML元素完全加载完毕后执行特定的JavaScript代码,但它们...

    JavaScript类库_JQuery1.8离线Api手册全中文版.zip

    开发者应尽量使用`$(document).ready()`而不是`window.onload`来尽早执行代码,以提高页面加载速度。 **总结** jQuery 1.8 API中文离线手册是开发者不可或缺的参考资料,它详细阐述了jQuery的各种功能和用法。通过...

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

    在JavaScript和jQuery中,`$(document).ready()`和`$(window).load()`是两种常见的事件绑定函数,它们分别用于在不同的页面加载阶段执行相应的代码。理解它们的区别和执行顺序对于优化网页性能和确保脚本正确运行至...

    my97 datepicker的'$db.cal'为空或不是对象问题解决参考

    2. **加载顺序问题**:my97 datepicker需要在DOM加载完成后才能初始化,因此它的脚本应该放在`&lt;body&gt;`标签的底部,或者使用`window.onload`或`$(document).ready`来确保在调用插件之前页面元素已经完全加载。...

    用javascript实现jquery的document.ready功能的实现代码

    在使用jQuery时,我们通常使用`$(document).ready()`方法来确保在文档完全加载到浏览器后执行代码。这是一个非常有用的功能,因为它允许开发者确保在操作DOM元素之前,这些元素已经完全可用。 然而,了解如何用纯...

    解决chrome对jQuery的支持问题

    2. **使用jQuery的`$.load()`**:除了`$(document).ready()`,jQuery还提供了`$(window).load()`,它的行为类似于原生的`window.onload`,等待所有资源加载后再执行。 3. **使用`DOMContentLoaded`事件**:这是原生...

    jquery中的$(document).ready()使用小结

    它的作用与window.onload相似,但只针对DOM树的加载进行监听,而不必等待图片、样式表等其他资源加载完成。使用$(document).ready()方法的示例如下: ```javascript $(document).ready(function() { alert("我的第...

    $(document)

    `$(document).ready(function(){ })` 与 `window.onload` 都可以用来等待页面加载完成后再执行特定的脚本,但它们之间存在明显的区别: - **`$(document).ready(function(){ })`**:仅在DOM加载完成后立即执行,...

    [removed]与$(document).ready()的区别分析

    在JavaScript和jQuery的世界里,`window.onload` 和 `$(document).ready()` 都是用来确保页面内容加载后执行特定脚本的事件,但它们之间存在一些关键的区别。理解这些差异对于编写高效、响应式的网页至关重要。 ...

    jquery教程chm格式

    17. 性能优化:使用$(document).ready()而非window.onload来尽早执行脚本,避免使用$符作为选择器前缀以提高性能。 综上所述,《jQuery教程CHM格式》涵盖了jQuery的各个方面,无论是初学者还是经验丰富的开发者,都...

Global site tag (gtag.js) - Google Analytics