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

最新推荐文章于 2024-07-02 15:03:05 发布
转载 最新推荐文章于 2024-07-02 15:03:05 发布 · 43 阅读 · 0 ·
CC 4.0 BY-SA版权
原文链接：http://www.cnblogs.com/zhaoleigege/p/5821893.html
文章标签：

#javascript #ViewUI

本文介绍了window.onload和$(document).ready()两种JavaScript页面加载事件触发方式的区别：1. window.onload等待页面所有资源完全加载后才执行，而$(document).ready()则在DOM结构加载完成后立即执行；2. window.onload只能定义一个，如果有多个则仅执行最后一个，而$(document).ready()可以定义多个并都能得到执行；3. $(document).ready()提供了简写形式。

1

window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。 
        $(document).ready()是DOM结构绘制完毕后就执行，不必等到加载完毕。 

2

  window.onload不能同时编写多个，如果有多个window.onload方法，只会执行一个 
         $(document).ready()可以同时编写多个，并且都可以得到执行 

 

3

    window.onload没有简化写法 
         $(document).ready(function(){})可以简写成$(function(){});

转载于:https://www.cnblogs.com/zhaoleigege/p/5821893.html

jQuery中的.ready()和window.onload的区别及示例代码
ByteZenith的博客
09-27 455
在JavaScript和jQuery中，我们经常需要在文档加载完毕后执行一些代码。jQuery提供了.ready()函数，而原生JavaScript则提供了window.onload事件。在上面的代码中，当文档解析完成后，$.ready()函数的回调函数将会被执行，并显示一条消息在控制台上。而当整个页面加载完成后，window.onload事件触发，它的回调函数同样会在控制台上显示一条消息。根据你的需求，选择适合的方法来确保你的代码在正确的时机执行。
window.onload与jQuery($(document).ready())
明德zhuang
07-17 686
(document).ready()方法
页面加载时执行js的几种方法
v587的博客
09-18 3977
$(function () {}); $(document).ready(function() { }); window.onload = function() { } 1.执行时间         window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。         $(document).ready()是DOM结构绘制完毕后就执行，不必等到加载完毕。 2.编
页面加载时执行的任务
wangkeke1996的博客
08-05 1304
1.onload function doSomething(){         //执行某种任务… … } 既可以在HTML标记中指定该函数：<body onload=”doSomething();”> 也可以在JavaScript代码中指定该函数：window.onload=doSomething; 这两种方式都会导致在页面加载完成后执行这个函数。但第2种方式的优点在于，它能使...
页面加载后自动执行
Sycc的博客
02-14 1368
页面加载后自动执行： 1.页面中很多数据都需要在页面加载完成，就自动发送ajax请求，填充到页面，无需用户手动操作。 有些元素的事件处理函数，也是在页面加载完成后，自动绑定上的。 2.解决：由于页面是顺序加载的，希望页面加载自动执行的代码，都放在body结尾的script中。 3.将js代码写在html文件中，不符合内容与行为分离的原则，不便于维护。 4.今后js代码都要放在独立的js文件中，在引入HTML文件里。 5.有的会放在开头，有的会放在结尾，如何保证不管放哪都可以自动执行？ 6.解决：把页面初始化
js 加载更多时，自动执行加载更多的方法。
qq_31860607的博客
03-16 2169
htlm: {{detail.productFullName
$(document).ready()与window.onload的区别
最新发布
No_Name_Cao_Ni_Mei的博客
07-02 520
选择使用还是取决于你的具体需求。如果你只需要确保DOM已经加载完成，并且正在使用jQuery，那么是一个更好的选择。如果你需要等待页面上的所有资源都加载完成，或者不使用jQuery，那么将更加合适。
全面解析jQuery $(document).ready()和JavaScript onload事件
10-22
在描述中提到，$(document).ready()仅执行一次，并且它和JavaScript的onload事件有着本质的区别。$(document).ready()只关注DOM元素是否已加载，而不是整个页面所有资源都加载完毕。这个方法非常适合用来初始化页面...
jquery的$(document).ready()和onload的加载顺序
10-29
在JavaScript和jQuery的世界里，了解`$(document).ready()`和`window.onload`的加载顺序是非常重要的，尤其是在处理页面加载和交互效果时。这两个事件都与页面加载有关，但它们触发的时机有所不同，这也可能导致在...
页面加载的两种方法
露阳 博客
05-08 927
document.ready和onload的区别——JavaScript文档加载完成事件 页面加载完成有两种事件： 一是ready，表示文档结构已经加载完成（不包含图片等非文字媒体文件）； 二是onload，指示页面包含图片等文件在内的所有元素都加载完成。   1、Dom Ready 用jQ的人很多人都是这么开始写脚本的：  $(function(){        // do s
jQuery的document ready与 onload事件——你真的思考过吗？
weixin_33736048的博客
07-04 163
在进行实验和资料查询时，我遇到了几个关键问题： 1. window.onload到底是什么加载完触发？ 2. body为什么会有onload事件？ 3. 为什么是window.onload，而不是document.onload？ 4. document ready到底是什么ready，DOM渲染完成？ 5. jQuery怎么实现$(document).ready？ 6. jQuery的...
document.ready()的用法
weixin_34107739的博客
11-01 246
1.Jquery是优秀的Javascrīpt框架,$是jquery库的申明，它很不稳定（我就常遇上）,换一种稳定的写法jQuery.noConflict(); jQuery(document).ready(function(){});使用jQuery的好处是它包装了各种浏览器版本对DOM对象(javascript的DOM对象你应该知道吧，就是它了)的操作.比如jquery写法： $("div p...
js页面加载前执行_Effective前端7：加快页面打开速度
weixin_39991055的博客
11-21 624
页面的打开速度对网站的优化有极大的意义，如果打开一个页面一直处于白屏状态，若超过5s，可能大部份人都会把它关了。或者是页面加载出来了，但是比较慢，页面显示不完整，标签栏一直在转圈，页面长期处于不可交互的状态，这也是一种很不好的体验。如何评价一个页面打开得快不快，可以用两个指标描述，一个是ready的时间，另一个是load的时间。这个可以从Chrome的控制台看到，如打开stackoverflow的...
JQ的$(document).ready()
Fairy的博客
02-23 1521
    window.onload() $(document).ready() 不能同时编写多个，多个是最后一个覆盖前面的ss 能同时编写多个 无简写方法 简写为$(function(){}); 等待网页中所有元素包括关联文件都加载完后才执行 （无需）  ...
jQuery页面加载方法
小灯博客
10-17 1112
第一种方法： $(function(){ alert("hello"); });文档加载完后执行函数（这里的文档树不等于全部文件） 第二种写法： $(document).ready(function(){ alert("hello"); });文档树加载完后执行函数 第三种写法： (function($){ alert("hello"); })(jQuery);函数执行完后加
$(document).ready(function()
ZiHanHanHanHan的博客
04-29 1076
$就是jquery的简写，$()就是一个选择器，document是html的所有元素，$(document）返回一个数组，而这个数组是一个对象，这个对象调用ready方法，function则是ready里面的参数，就是说等这个页面全部加载完之后就去执行写入的js。而且在$(document）.ready(function(){ });里面写入的js特效是和下一个里面写入的特效是不冲突的，俩者之间是不影响的，因此可以通过$(function(){});在一个页面中加载多个js。 不管怎么样，要...
$(document).ready(function() {})
anmoyyh的博客
08-02 1133
$(document).ready(function() {}) 这句话的意思是: 当文档载入时执行function函数里的代码 这部分代码主要声明，页面加载后 “监听事件” 的方法。 例如： $(document).ready( $("a").click(function(){alert('你点我干嘛')}); )； 这句的意思是： 页面加载成功后，页面内的所
jquery中的$(document).ready()
醉梦洛的博客
01-31 2871
直接上代码解释： ①.下面是在页面加载完，自动执行定义js代码（function） window.onload = function(){ alert("welcome"); } ②.下面该函数是用来取代页面中的window.onload  $(document).ready(function(){.... }) 注：document.ready()和传统的方法<body ...
document.ready与window.onload的区别
06-09
`document.ready` 是 jQuery 的一个事件，它在 DOM 树构建完成后就会执行，此时页面可能还没有加载完所有的资源（如图片、视频等），所以它比 `window.onload` 事件更早触发，可以更快地执行 JavaScript 代码。...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值