本文主要是介绍$(document).ready()与$(window).load()的区别,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
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()
都将被覆盖;
<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下载框执行隐藏。
<script>$(document).ready(function(){$(".the_body a").attr("onclick","alert('test')");});$(window).load(function(){$(".close_btn").click(function(){$("#app_down").hide();});});
</script>
文章转自:http://www.wufangbo.com/document-ready-window-load/
这篇关于$(document).ready()与$(window).load()的区别的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!