前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >$(window).load()与$(document).ready()的区别

$(window).load()与$(document).ready()的区别

作者头像
java达人
发布2018-01-31 11:26:01
1K0
发布2018-01-31 11:26:01
举报
文章被收录于专栏:java达人java达人

1.执行时间不同:从字面的意思上理解,$(document).ready()就是文档准备好了。也就是浏览器已经解析完整个html文档,dom树已经建立起来了,这时就可以通过class属性或者id属性等等对dom进行操作等。而$(window).load()就是整个页面已经加载完毕。与前者的区别是dom树虽然已经建立起来了,但页面不一定加载完毕,如一些大的图片等,加载完成就需要一定的时间;但是页面加载完毕后,dom肯定也就建立起来了;但是有些文字或者图片链接等需要在文档加载完毕前,dom树建立后就进行的,这时就要用到$(document).ready()了。

2.可以被执行的次数不同:$(document).ready()可以在JavaScript代码中出现多次,并且里面的函数或者代码都可以得到执行;而$(window).load()只能在JavaScript代码中出现一次,如果有多个$(window).load(),那么只有最后一个$(window).load()里面的函数或者代码才会执行,之前的$(window).load()都将被覆盖;

Js代码

代码语言:js
复制
<script>  
$(document).ready(function(){  
alert("test1");//这段代码会被执行 
});  
$(document).ready(function(){  
alert("test2");//这段代码会被执行 
});  
$(window).load(function(){  
alert("test1");//这段代码不会被执行 
});  
$(window).load(function(){  
alert("test2");//这段代码将被执行 
});  
</script>  

3.执行的效率不同:如要在dom的元素节点中添加onclick属性节点,这时用$(document).ready()就要比用$(window).load()的效率高;但是在某些时候还必须得用$(window).load()才行,如之前写的app下载,如果要关闭这个下载框,则必须要在整个下载框加载完毕后,才能点击关闭图标,对app下载框执行隐藏。

Java代码

代码语言:js
复制
<script>  
$(document).ready(function(){  
$(".the_body a").attr("onclick","alert('test')");  
});  
$(window).load(function(){  
$(".close_btn").click(function(){  
$("#app_down").hide();  
});  
});  
</script>  

另外,$(document).ready()还有多种形式的写法,有$().ready( function(){} ); 有$(document).ready( function(){});还有$(function(){}).

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2015-06-23,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 java达人 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档