jQuery中的$(doncument).ready()详解

window.οnlοad=function(){alert("welcome");}
该语句的作用是希望在页面加载完,自动执行定义JS代码(function)。
$(document).ready(function(){……})这个函数是用来取代页面中的window.onload;
$(document).ready()方法是事件模块中最重要的一个函数,可以极大的提高Web应用程序的响应速度。


一、$(document).ready()和onload的区别

1.执行时机


JS(window.onload):网页中所有元素(包括元素的所有关联文件)完全加载后才运行,这包括DOM元素和其它页面元素(例如图片)的加载。

jQuery($(document).ready()):DOM元素被加载完成的情况下执行,这并不意味着关联文件已经加载完毕。

所以,使用$(document).ready方法的执行速度比onload()的方法快。

JavaScript只有在DOM元素已经定义以后才可以对其执行某种操作,jQuery使用document.ready来保证所要执行的代码是在DOM元素被加载完成的情况下执行的。

注意:

在使用$(document).ready()的过程中,可能会出现已经将HTML解析为DOM树了,可是图片等相关文件还没有加载完毕,可以用jQuery的load方法解决这个问题。代码如下:

$(window).load(function(){
//编写代码
})

注意:

确保在<body>元素的onload事件中没有注册函数,否则可能不会触发$(document).ready()事件。

2.多次使用问题

JS(window.onload):每一个onload只能保存对一个函数的引用,它会自动用后面的函数去覆盖前面的函数。

jQuery($(document).ready()):函数会按照注册(绑定)的顺序依次执行。

  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值