jQuery页面加载后执行的事件(3种方式)

最新推荐文章于 2026-05-17 05:12:54 发布
原创 最新推荐文章于 2026-05-17 05:12:54 发布 · 1.1w 阅读 · 5 ·
本内容遵循CC 4.0 BY-SA版权协议
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
标签
#jquery #前端 #javascript
本文探讨了三种常见的前端页面加载方式：使用jQuery的立即执行、利用document.ready事件以及window.onload事件。通过实例代码展示了不同加载策略的实现方法。 
1 $(function () { });

2 $(document).ready(function () { });

3 window.onload = function () { }

下面是我个人的公众号：

我会经常分享一些关于后端、Java、前端、架构、数据库以及工具等方面的文章，感兴趣的同学可以关注一下哦~ 

 

页面加载完成后执行jQuery的写法及区别
TechNovaX的博客
10-10 608
传统的JavaScript写法使用window.onload事件来实现，而使用jQuery可以更简洁地使用.ready()方法来实现相同的功能。因此，对于需要在页面加载完成后执行JavaScript代码的情况，推荐使用jQuery的写法。jQuery是一个流行的JavaScript库，提供了简洁易用的API，可以简化JavaScript代码的编写。本文将介绍使用jQuery在页面加载完成后执行JavaScript的写法，并对其与传统JavaScript的区别进行说明。然而，这种传统的写法存在一些问题。
jQuery页面加载完毕后执行事件
热门推荐
数字成都
03-15 4万+
首先最简单的方法。jquery的一种简写形式： alert("页面加载完成！")； }); 其对应的完整形态为： $(document).ready(function(){ alert("页面加载完成！")； }); 原生JS方法： window.function(){ alert("页面加载完成！")； } 这几种方法在功能上的效果是一样的，但是三者还是有一...
jquery页面加载后执行的常见方式
乐逍遥
07-07 5314
jquery页面加载后执行的常见方式
告别拉伸与留白：v-scale-screen插件实战解析与大屏适配最佳实践
最新发布
weixin_30617797的博客
05-17 447
本文深入解析v-scale-screen插件在大屏适配中的实战应用，解决传统方案中的拉伸变形与留白问题。通过等比缩放机制和两种适配模式，实现跨分辨率完美展示，提升开发效率与视觉效果。适用于Vue项目，包含安装指南、参数详解及性能优化技巧。
jquery页面加载完成后执行方法的几种方式
jack_rose_me的博客
11-02 1万+
1、$(function(){ 　　$("#a").click(function(){ 　　　　//adding your code here 　　}); }); 2、$(document).ready(function(){ 　　$("#a").click(function(){ 　　　　//adding your code here　　 　　}); }); 3、window.onload = function(){ 　　$("#a").click(function(){ 　　　　...
jQuery 页面加载后执行的事件(3 种方式)
听胡说
07-30 786
刚刚工作，没怎么用过 jQuery。今天在工作中遇到一个 jQuery 问题，页面加载的时候需要触发函数，第一直觉告诉我应该写成 onload()，结果不是。后来查了文档发现是 load()，但是版本有限制，我引入的 jQuery 类库太新了，不支持，通过网上查找，找到了以下 3 个方法，都是浏览器加载时触发的方法。 $(function () { }); $(document).re...
页面加载完成后再执行JS的jquery写法以及区别说明
海阔天空的博客
02-23 1181
1、$(function(){  　　$("#a").click(function(){  　　　　//adding your code here  　　});  });  2、$(document).ready(function(){  　　$("#a").click(function(){  　　　　//adding your code here　　  　　});  }); 
JavaScript--JQuery事件 & 当网页元素加载完成后再去执行事件
天行健 君子以自强不息，地势坤 君子以厚德载物。
07-15 2696
1. JQuery事件 这里的selector都是CSS选择器的语法 CSS选择器 示例1 弹出提示框: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!-- 成功引入Jquery--> <script src="lib/jq.js"></scr
JQuery的几种页面加载完执行三种方式
dazigeng4522的博客
04-01 331
jquery加载页面的方法(页面加载完成就执行) 1、 1 $(function(){ 2 　　$("#a").click(function(){ 3 　　　　//adding your code here 4 　　}); 5 }); 2、 1 $(document).ready(function(){ 2 　　$("#a").cli...
JQuery页面加载后执行的事件（3种方式）
gaofeng的博客
08-24 903
$(function ( ) { } ); window.onload = function ( ) { } $(document).ready(function ( ) { } );
JQuery 之 在数据加载完成后才自动执行函数
weixin_34159110的博客
02-21 1361
　　数据加载完成执行：　　$(window).load(function(){ ... });　　进入页就执行，不论等数据是否加载完成：　　$(document).ready(function(){ ... })　　这个还可以简写成　　$(function(){ ... }); 　　以下为解析：$(document).ready、body.Onload()和 $(window).load的区别 ...
在JavaScript中，如果需要在页面加载完成后执行某些代码的两种方法
luckyext的博客
03-02 1140
在JavaScript中，如果需要在页面加载完成后执行某些代码的两种方法， 使用 jQuery 的 $(document).ready()和使用 window.onload
jQuery和js的页面加载后触发事件有什么区别
m0_46639782的博客
07-17 508
JavaScript 的 window.onload：这是 JavaScript 提供的事件，表示整个页面（包括资源如图片等）都已经加载完成后执行相应的处理程序。因此，在使用 window.onload 时，可能需要等待更长的时间来执行操作。$(document).ready() 事件在 DOM 加载完成后立即触发，无需等待其他资源完成加载，适合处理 DOM 相关操作。window.onload 事件表示整个页面及其资源都已加载完毕后触发，适合处理需要等待所有资源加载完成后的操作。
页面加载完成事件 - onload，四种写法
yiyueqinghui的博客
11-17 2万+
在js和jquery使用中，经常使用到页面加载完成后执行某一方法。通过整理，大概是五种方式： js动态加载外部插件后，导致页面加载顺序不是按照代码的书写顺序执行，引起报错， 这时候就可以用监听页面加载完成事件来指定代码的加载顺序 1、JQuery方法 方法 $(function){} $(document).ready(function(){}) 说明 $(function){}是$(document).ready(function(){})的简写方式。 两个都是document加载完成后就执行回调
界面加载完后执行Jquery
LoveHerHair的博客
08-10 7005
1、$(function () { }); 例如： $(function(){ alert("加载完成"); }); 2、$(document).ready(function () { }); 例如： $(document).ready(function(){ alert("加载完成"); }); 3、window.onload = func
页面加载完成后执行JS的5种方式
ALEX_wxy的博客
11-09 3万+
在js和jquery使用中，经常使用到页面加载完成后执行某一方法。通过整理，大概是五种方式。 1.jQuery的$( function(){} ); 2.jQuery的$(document).ready( function(){} );前两者本质上没有区别，第1种是第2种的简写方式。两个是document加载完成后就执行方法。 3.jQuery的$(window).load( functio...
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值