`

window.onload与$(document).ready()执行时间

阅读更多
onload事件是在所有资源都准备完成之后才执行。
$(document).ready()该方法实现的页面加载后 执行函数将在浏览器构建完DOM树后立刻执行,而并不需要等待图片等外部资源下载完成。

而window.onload会在整个文档都加载完成后才会执行,常见的就是对于页面含很多图片的情况下,必须等到图片都下载 下来后才会执行。而$(document).ready()不会。

$(document).ready()会优于window.onload先执行.


另一种情况:
IE在页面中嵌入frame中的情况下才和Firefox等一样,先执行$(document).ready()的内容, 再执行原来的onload方法。对于嵌入frame中的页面,也只是绑定在load事件上执行,所以自然是在原来的onload绑定的方法执行之后才轮 到。而这个页面中正好在测试环境下有一个访问不到的资源,那十几秒的延迟正是它放大出的时间差。
(待验证)
分享到:
评论

相关推荐

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

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

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

    1. **执行时间**:`$(document).ready()`先于`$(window).load()`执行,因为它不等待所有外部资源的加载。而`$(window).load()`必须等到所有资源加载完毕才会执行。 2. **可执行次数**:`$(document).ready()`可以被...

    document.ready和window.onload.docx

    windows

    一张表格告诉你windows.onload()与$(document).ready()的区别

    在JavaScript和jQuery中,`window.onload()` 和 `$(document).ready()` 都是用于处理页面加载事件的关键函数,但它们的执行时机和用法存在显著差异。了解这些区别对于优化前端性能和确保代码正确执行至关重要。 1. ...

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

    3. 使用jQuery的`$.holdReady(true)`和`$.holdReady(false)`组合,来控制`$(document).ready`的执行时机。 4. 如果可能,避免在frame中加载页面,或者确保frame内页面的资源都能正确访问。 理解`$(document).ready...

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

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

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

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

    实现在HTML页面加载完毕后运行js方法.docx

    `window.onload` 事件是在页面中的所有元素都已经加载完毕后触发的,而 `$(document).ready()` 方法是在 DOM 加载完毕后执行的,虽然这也意味着页面中的所有元素都可以被 JavaScript 代码所操作,但是,并不意味着...

    js 某个页面监听事件渲染完毕的时间.pdf

    JavaScript页面渲染完毕时间的监听是前端开发者不可或缺...通过合理选择和使用`window.onload`、`$(document).ready`或`DOMContentLoaded`事件,我们可以确保在正确的时间执行必要的操作,从而提升网页的性能和交互性。

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

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

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

    `window.onload`的缺点在于,由于它等待所有资源加载,因此执行时间可能会比`document.ready`晚很多。 两者之间的主要区别在于触发时机: 1. **触发时间**:`document.ready`在DOM准备就绪时触发,而`window....

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

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

    $(document)

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

    jQuery中的ready函数与[removed]谁先执行

    本文将深入探讨jQuery中的`$(document).ready()`函数与`window.onload`事件的区别,并解析它们各自的执行时机。 首先,我们来看`$(document).ready()`,这是jQuery提供的一种方法,用于在文档对象模型(DOM)准备...

    onload和jquery运行顺序

    window.onload = function () { console.log('window.onload 方式执行') } $(document).ready(function () { console.log('$(document).ready(function(){}) 方式执行') })

    Jquery 在页面加载后执行的几种方式

    与`$(document).ready()`不同的是,`window.onload`只能被调用一次,并且需要等待页面上所有资源加载完成,因此它会在`$(document).ready()`之后执行。 ```javascript window.onload = function() { // 你的代码 }...

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

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

    Jqyery中同等与js中windows.onload的应用

    关于在页面中放置脚本,将DOM操作的代码放在 `window.onload` 或 jQuery 的 `document ready` 事件中,可以确保元素在执行相关操作时已经存在。例如,下面的代码绑定了按钮点击事件: ```html <div id="divInfo">...

    JQ ready()和onload的加载耗时

    `$(document).ready()`与`window.onload`的主要区别在于执行时机。`ready`更早,它允许更快地访问和操作DOM,提高用户体验。而`onload`则确保了所有资源加载完毕,适用于那些依赖所有资源的场景,如图片计数、页面...

Global site tag (gtag.js) - Google Analytics