JavaScript的极常用语句 $(document).ready(function() {...}) 是什么意思? 其中的符号$是什含义?$(“.btn“).click(function(){

文章解释了$(document).ready的用途,即在DOM加载完成后执行JavaScript代码,与jQuery库中的$符号区别,以及如何在jQuery中选择元素和执行操作。对比了$.click和$(document).ready的使用场景。

$(document).ready(function() {...}) 是一种约定俗成的方式,用于确保页面的 DOM(文档对象模型)已经加载并准备就绪后再执行其中包含的 JavaScript 代码。
这是为了确保代码不会在页面还没有完全加载时运行,从而避免潜在的问题。一旦页面的 DOM 结构准备就绪,这个函数内的代码将被执行。

在JavaScript中,符号$通常表示一个特定的含义,它通常与JavaScript库jQuery相关。jQuery是一个流行的JavaScript库,用于简化DOM操作和事件处理。在jQuery中,$符号是用来引用jQuery对象的缩写。使用$可以轻松选择DOM元素、执行DOM操作和处理事件。

例如,使用$来选择一个具有特定ID的元素:

var myElement = $('#myElementId');

$还用于执行各种操作,如添加/删除类、修改样式、绑定事件等。这个符号使得代码更简洁和易读,因为它允许使用链式方法来处理DOM元素。

需要注意的是,$不是JavaScript语言本身的一部分,它是jQuery库的一部分。如果您不使用jQuery,$符号没有特殊含义,可以在您的JavaScript代码中使用其他方式。如果您正在使用其他JavaScript库或框架,可能会有不同的符号和约定。

提问:代码 $(“.btn”).click(function(){ 和代码 $(document).ready(function() 有啥区别?
答案见博文:https://blog.youkuaiyun.com/wenhao_ir/article/details/134030698

`$(window).on('load')` 和 `$(function () {})` 存在以下区别: #### 执行时机 - `$(function () {})` 是 `$(document).ready()` 的简写形式,其函数内的语句在 DOM 元素加载完毕时执行,也就是网页结构加载完毕,但关联的文件可能未下载完,图片也可能未加载出来时就会执行[^1][^3]。 ```javascript $(function () { console.log('DOM 已加载'); }); ``` - `$(window).on('load')` 会在所有内容(包括窗口、框架、对象和图像等)加载完毕后触发,即网页的所有元素都加载完毕后才执行,包括图片、关联文件等[^1][^3]。 ```javascript $(window).on('load', function () { console.log('所有资源已加载'); }); ``` #### 性能差异 由于 `$(function () {})` 在 DOM 就绪后就执行,不需要等待图片等资源加载,所以通常执行时间较早,性能开销相对较小,适合在需要尽快操作 DOM 元素时使用。而 `$(window).on('load')` 要等待所有资源加载完成,执行时间较晚,性能开销相对较大,尤其是当页面包含大量图片或大型文件时,等待时间会更长。 #### 应用场景 - `$(function () {})` 适用于需要在 DOM 结构可用时立即执行的操作,如初始化表单验证、绑定事件等。 ```javascript $(function () { $('form').on('submit', function (e) { e.preventDefault(); // 表单验证逻辑 }); }); ``` - `$(window).on('load')` 适用于依赖于所有资源加载完成的操作,如获取图片的真实尺寸、进行页面布局调整等。 ```javascript $(window).on('load', function () { var imgWidth = $('img').width(); console.log('图片宽度为: ' + imgWidth); }); ```
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

昊虹AI笔记

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值