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

转载 2015年07月09日 10:46:45

Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法,不过与window.onload方法还是有区别的。

1.执行时间 

         window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。 

        $(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕。 

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

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

在我以前的开发中,一般用到javascript,我都是采用jquery的模式,也就是大多数时候,第一行写的是:

复制代码代码如下:

$(document).ready(function(){
...
});

这个时候,不一定要等所有的js和图片加载完毕,就可以执行一些方法,不过有些时候,必须要等所有的元素都加载完毕,才可以执行一些方法的时候,比如说,部分图片或者什么其他方面还没有加载好,这个时候,点击某些按钮,会导致出现意外的情况,这个时候,就需要用到:

复制代码代码如下:

$(window).load(function() {
$("#btn-upload").click(function(){   //比如说:
 uploadPhotos();
});
});

注意在所有DOM元素加载之前执行的jQuery代码,有时候我们有这个需要。

复制代码代码如下:
<script type="text/javascript">
(function() {
            alert("DOM还没加载哦!");
        })(jQuery)
  </script>


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

jQuery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法,不过与window.onload方法还是有区别的。 1.执行时间    ...
  • ligang2585116
  • ligang2585116
  • 2014年12月21日 23:46
  • 2189

jQuery中$(document).ready与Javascript中window.onload区别

JQuery中$(document).ready与Javascript中window.onload道理有什么区别呢?网上的说法很多,但是发现使用不同版本jquery,效果有完全不一样,很难去回答一下问...
  • hsd2012
  • hsd2012
  • 2017年05月08日 21:28
  • 756

$(document).ready()和原生js下的window.onload的区别

区别1: $(document).ready()是规定DOM(网页文档)加载完成后网页内容加载之前执行的,也就是说在html加载完成后,图片加载之前。 window.onlad()是在页面所有元素...
  • zx_p24
  • zx_p24
  • 2016年11月24日 10:06
  • 1776

window.onload()和$(document).ready()区别

在做itoo项目中,碰到一个问题就是有个js中的方法始终是执行不到,原因就是该方法放在了window.onload()下,而又由于页面加载不完的原因,导致该方法始终执行不到。        所以改用...
  • u011458469
  • u011458469
  • 2015年07月26日 11:29
  • 1119

angularjs 实现 window.onload() $(document).ready() 的方法

controller控制器js加载时添加事件 (function(){ var app = angular.module('SMCS.App'); app.controller('Seriou...
  • u010081710
  • u010081710
  • 2016年03月22日 18:23
  • 752

jQuery中document的ready和load事件的区别?

概述: 大家在工作中用jQuery的时候一定会在使用之前这样: 1 2 3 4 5 6 7 8 //document ready $(document).r...
  • qq_14849723
  • qq_14849723
  • 2014年12月18日 11:26
  • 1511

jQuery中ready和load的区别

ready事件先于load事件被激活,如果网页文档中没有加载外部文件,则它们的响应时间基本上是相同的....
  • u010555110
  • u010555110
  • 2016年07月08日 15:03
  • 932

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

区别: http://blog.csdn.net/xiebaochun/article/details/36375481 jQuery方法的构建原理 http://www.cnblo...
  • qq_38844636
  • qq_38844636
  • 2017年10月01日 21:57
  • 112

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

转自:脚本之家 Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法,不过与window.onload方法还是有区别的。 1....
  • zjhhust
  • zjhhust
  • 2013年08月21日 09:49
  • 292

【jQuery】 $(document).ready() 与window.onload的区别

Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法,不过与window.onload方法还是有区别的。 1.执行时间 win...
  • u012602393
  • u012602393
  • 2013年11月13日 15:37
  • 993
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:jquery $(document).ready() 与window.onload的区别
举报原因:
原因补充:

(最多只允许输入30个字)