$(document).ready()方法和window.onload有什么区别?

news2024/10/2 22:30:13

        1.触发时间点:$(document).ready() 方法在 DOM 树构建完毕,并且所有的 DOM 元素都可以操作时触发,不需要等待所有的资源(如图片)都加载完成。而 window.onload 事件是在所有的资源都加载完成后触发。

        2.执行顺序:$(document).ready() 方法可以多次调用,它们会按照调用的顺序依次执行。而 window.onload 事件只能被绑定一次,如果多次调用,只有最后一个绑定的事件会执行。

        3.页面加载状态:$(document).ready() 方法在页面的加载过程中就会触发,即使页面的其他资源还没有加载完成。而 window.onload 事件只有在页面的所有资源都加载完成后才会触发。

        4.使用方式:$(document).ready() 方法是 jQuery 提供的,需要引入 jQuery 库,并使用 jQuery 的语法来调用。而 window.onload 是 JavaScript 原生提供的事件,可以直接在 JavaScript 中使用。

        综上所述,$(document).ready() 方法更适用于在 DOM 准备完毕后执行一些操作,比如修改 DOM 结构、绑定事件等。而 window.onload 事件适用于在页面所有资源加载完成后执行一些需要依赖所有资源的操作,比如操作图片、视频等。

        以下是一串代码示例来区分 $(document).ready() 方法和 window.onload 事件:

// 使用 $(document).ready() 方法
$(document).ready(function() {
  // 在 DOM 准备完毕后执行的操作
  console.log("DOM is ready");
});

// 使用 window.onload 事件
window.onload = function() {
  // 在页面所有资源加载完成后执行的操作
  console.log("All resources are loaded");
};

在这个示例中,当页面加载时,首先会触发 $(document).ready() 方法,然后在所有资源加载完成后会触发 window.onload 事件。你可以在控制台中查看两个不同的日志输出。

需要注意的是,如果使用了 jQuery 库,并且使用了 $(document).ready() 方法,那么可以简写为:

$(function() {
  // 在 DOM 准备完毕后执行的操作
  console.log("DOM is ready");
});

这种简写方式与 $(document).ready() 的效果是一样的。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1293580.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

元宇宙:重塑游戏行业体验下一个前沿

游戏行业在其整个历史中经历了显著的转变,从超级马里奥的像素化冒险发展到Red Dead Redemption等游戏中迷人的开放世界体验。随着时间的推移,游戏不断突破数字领域所能达到的极限。然而,被称为元宇宙的突破性演变将彻底改变游戏行业&#xff…

【复杂gRPC之Java调用go】

1 注意点 一般上来说如果java调用java的话,我们可以使用springcloud来做,而面对这种跨语言的情况下,gRPC就展现出了他的优势。 代码放在这了,请结合前面的go服务器端一起使用 https://gitee.com/guo-zonghao/java-client-grpc /…

2-4、DEBUG和源程序区别

语雀原文链接 文章目录 1、DEBUG 和 汇编编译器MASM区别1:默认进制不同区别2:[地址]示例1:debug示例2:[0]示例3:[寄存器]示例4:ds:[0]小结 区别3:源程序数据不能以字母开头 1、DEBUG 和 汇编编…

labelme等标注工具/数据增强工具输出JSON文件格式检查脚本

标注的文件太多了,还有用数据增强工具生成了一票的新数据。在转换或使用训练时候会报错,错误原因是json中语法有问题,这样会中断程序运行,调试造成很大困扰。 检查确实最后有问题,多写了一次 写一个脚本,用…

机器学习应用 | 使用 MATLAB 进行异常检测(下)

在使用MATLAB 进行异常检测(上)中,我们探讨了什么是异常值,简单的一维数据异常检测问题,针对高维数据的有监督异常检测方法。 在(下)篇中,我们将和大家一起探讨无监督异常检测。 没…

Unity 状态系统

状态系统 原理食用方法Demo 原理 #mermaid-svg-lUbxJ8eMP3KqrEhY {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-lUbxJ8eMP3KqrEhY .error-icon{fill:#552222;}#mermaid-svg-lUbxJ8eMP3KqrEhY .error-text{fill:#55…

算法通关村第十八关-青铜挑战回溯是怎么回事

大家好我是苏麟 , 今天聊聊回溯是怎么个事 . 回溯是最重要的算法思想之一,主要解决一些暴力枚举也搞不定的问题,例如组合、分割、子集、排列,棋盘等。从性能角度来看回溯算法的效率并不高,但对于这些暴力都搞不定的算法能出结果就…

快速排序的非递归实现

上期我们实现了快速排序的递归实现,但是我们知道如果递归深度太深,栈就会溢出,所以我们本期将为大家讲述快速排序的非递归实现,我们需要用到栈的数据结构,我们知道栈中的数据全是在堆区开辟的空间,堆的空间…

【EXCEL】offset函数

语法: offset(reference,row,column,[height],[width]) 例子:

【日常总结】mybatis-plus WHERE BINARY 中文查不出来

目录 一、场景 二、问题 三、原因 四、解决方案 五、拓展(全表全字段修改字符集一键更改) 准备工作:做好整个库备份 1. 全表一键修改 Stage 1:运行如下查询 Stage 2:复制sql语句 Stage 3:执行即可…

Volumetric Lights 2 HDRP

高清晰度渲染管道,包括先进的新功能,如半透明阴影图和直接灯光投射加上许多改进。 插件是一个快速,灵活和伟大的前瞻性光散射解决方案的高清晰度渲染管道。只需点击几下,即可改善场景中的照明视觉效果。 兼容: 点光源 聚光灯 碟形灯 矩形灯 通过覆盖摄像机周围大面积区域的…

05 JQuery基础入门

文章目录 一、jQuery介绍1. 简介2. 版本介绍3. 相关网站4. HTML引入方式 二、基础语法1. 顶级对象$2. 与DOM对象转化3. 选择器4. 事件5. 动画6. 修改样式7. 修改属性 一、jQuery介绍 1. 简介 jQuery是JavaScript编程语言底层库,它是一个快速,简洁的Jav…

JavaScript <关于逆向RSA非对称加密算法的案例(附原代码)>--案例(五)

前言: 趁热打铁,标记一下RSA的算法逆向...第二篇会有详解(本篇重在过程) 正文: 废话不说,直接分析步骤图: 到了这里,可以看到在登录的时候,需要验证码(本篇不教反验证码) 下面是正题--->逆他的pwd(密码) 总结: 问题:怎么确定一个密文数据是基于什么算法做出来的呢? 答:…

python 涉及opencv mediapipe知识,眨眼计数 供初学者参考

基本思路 我们知道正面侦测到人脸时,任意一只眼睛水平方向上的两个特征点构成水平距离,上下两个特征点构成垂直距离 当头像靠近或者远离摄像头时,垂直距离与水平距离的比值基本恒定 根据这一思路 当闭眼时 垂直距离变小 比值固定小于某一个…

Abaqus基础教程--胶合失效仿真

胶合是电子行业中常见的连接方式,abaqus中常用cohesive单元或者cohesive接触两种方法进行胶合失效仿真,这两种方式操作方法有所差别,但结果一般大同小异。 本例模型比较简单,建模过程从略,使用静态分析,使…

python基于ModBusTCP服务端的业务实现特定的client

python实现ModBusTCP协议的client是一件简单的事情,只要通过pymodbus、pyModbusTCP等模块都可以实现,本文采用pymodbus。但要基于ModBusTCP服务端的业务实现特定的client,那得看看服务端是否复杂。前面系列文章,我们学习了对服务端…

【vtkWidgetRepresentation】第五期 vtkLineRepresentation

很高兴在雪易的CSDN遇见你 内容同步更新在公众号“VTK忠粉” 【vtkWidgetRepresentation】第五期 一条直线的交互 前言 本文分享vtkLineRepresentation,希望对各位小伙伴有所帮助! 感谢各位小伙伴的点赞关注,小易会继续努力分享&#xf…

Python---继承

1、什么是继承 我们接下来来聊聊Python代码中的“继承”:类是用来描述现实世界中同一组事务的共有特性的抽象模型,但是类也有上下级和范围之分,比如:生物 > 动物 > 哺乳动物 > 灵长型动物 > 人类 > 黄种人 从哲学…

Go--协程

协程 协程是Go语言最大的特色之一。 1、协程的概念 协程并不是Go发明的概念,支持协程的变成语言有很多。Go在语言层面直接提供对协程的支持称为goroutine。 1.1 基本概念 进程 进程是应用程序启动的实例,每个进程都有独立的内存空间,不同…

DSP外部中断笔记

中断原理 三部分 注意 ,外部中断使能,PIE使能,CPU中断使能 外部中断有7个,PIE有12组,一个组有8个中断复用。只有一个CPU中断可执行。 外部中断原理 1、外部中断概述 外部中断结构图 外部中断XINT1对应的是0到31GPI…