window.onload和$(docunment).ready的区别

      浏览器加载完DOM后,会通过javascript为DOM元素添加事件,在javascript中,通常使用window.onload()方法。

在jquery中,则使用$(document).ready()方法。下面介绍一下两者的区别。

1.执行时机 
      window.onload :必须在页面所有元素(包括图片,引用文件)加载完后执行。。 
      $(document).ready() :是页面中所有HTML DOM,CSS DOM结构加载完之后就会执行,其他图片可能没有加载完。

如果想要网页所有内容(包括图片等)加载完毕,再注册事件,使用$(window).load(function);等价于window.onload()。

2.编写个数不同 

       window.onload :不能同时写多个,后面的将会覆盖前面的。

      $(document).ready() :可以同时编写多个,并且都可以得到执行。

3.简化写法 

      window.onload :无。

      $(document).ready() :

$(document).ready(function(){
  //to do;
});

$().ready(function(){ //$()不带参数默认是document
  //to do;
});

$(function(){
  //to do;
});

最后附上一段在所有DOM元素加载之前执行的jQuery代码

<script type="text/javascript">
(function() {
            alert("DOM还没加载哦!");
        })(jQuery)
  </script>

 

      

posted @ 2017-03-13 15:39  键盘敲飞  阅读(1754)  评论(0编辑  收藏  举报