大多数jQuery实例或教程都告诉我们绑定我们的jQuery代码到$(document).ready事件。虽然$(document).ready 事件在大多数情况下都OK，但是它的解析顺序是在文档准备就绪，但文档中的图片等对象正在下载的时候开始运行的。所以在某些时候使 用$(document).ready事件并不一定能达到我们预期的效果，比如一些视觉效果和动画、拖拽、预读取隐藏图片等…通过使 用$(window).load事件便可以安全的在整个文档都准备就绪之后再开始运行你期望的代码。

$(window).load(function(){
// 将你希望在页面完全就绪之后运行的代码放在这里
});

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

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(){});

 
 
 

用$(window).load(function(){...})而不用body.onload()的几个理由
首先它们都是在页面所有元素(包括html标签以及引用到得所有图片,Flash等媒体)加载完毕后执行的,这是它们的共同点.

不用body.Onload()理由1：

如果我们想同时加载多个函数,我们必须这样写

<body onload="fn1(),fn2()"></body>看起来极其丑陋,如果用$(window).load()我们可以这样加载多个函数

 
 $(window).load(function() {

            alert("hello,我是jQuery!");

  });

 $(window).load(function() {

        alert("hello,我也是jQuery");

 });
 

不用body.Onload()理由2：

用body.Onload()不能够做到js和html完全分离,这是一个很严重的问题.

另外用$(window).load(function(){...})和body.onload()都存在同样一个问题,因为开始也说到了,它们都需要等到页面的所有内容

加载完毕才执行,但是如果当网速比较慢的时候,加载一个页面往往需要较长的时间(几秒到十几秒不等,甚至更长...),所以我们经常

会遇到页面还没有完全加载完毕而用户已经在操作页面了这种情况,这样页面表现出来的效果就跟我们预期的效果不一样了,

所以在这里我推荐使用$(document).ready(function(){}),或简写为$(function(){})，因为他会在页面的dom元素加载完毕后就执行,

而无需等到图片或其他媒体下载完毕.

但是有时候确实我们有需要等到页面的所有东西都加载完后再执行我们想执行的函数,所以是该使用$(window).load(function(){...})还是

该使用$(function(){})往往需要结合具体需要而作不同的选择.

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

<script type="text/javascript">

(function() {

            alert("DOM还没加载哦!");

        })(jQuery)

  </script>

jquery的$(window).load和原生js的window.onload的使用方法：

$(window).load(function() {

    //jquery代码

});
 
window.onload=function(){

   var obj=document.getElementById("TableA").getElementsByTagName("td");

   if(!obj){return false}

   for(var i=0;i<obj.length;i++){

       obj[i].onfocus=function(){this.style.background="#ff0000"}

       obj[i].onblur=function(){this.style.background="";}

   }

}
 

源：http://www.cnblogs.com/Chen-XiaoJun/articles/5829876.html

jQuery中的$(window).load()与$(document).ready()以及jquery $(document).ready() 与window.onload的区别的更多相关文章

  1. Jquery中$(document).ready() 和 JavaScript中的window.onload方法 比较

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

  2. $(window).load(function() {})和$(document).ready(function(){})的区别

    JavaScript 中的以下代码 : Window.onload = function (){// 代码 }  等价于  Jquery 代码如下: $(window).load(function ( ...

  3. $(document).ready()与window.onload的区别，站在三个维度回答问题

    1.执行时机 window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行.         $(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕. 2 ...

  4. jQuery（4）—— jQuery中的事件

    jQuery中的事件 [加载DOM] 在常规的JavaScript代码中,通常使用window.onload方法,在jQuery中,使用的是$(document).ready()方法.极大地提高了we ...

  5. jQuery中 end(); 的用法

    jQuery中的end()方法的意思 选取某个元素,查找选取其子元素,然后再回过来选取这个元素.用例子说明了一下: 比如HTML代码: <p><span>Hello</s ...

  6. 深入理解ajax系列第九篇——jQuery中的ajax

    前面的话 jQuery提供了一些日常开发中需要的快捷操作,例如load.ajax.get和post等,使用jQuery开发ajax将变得极其简单.这样开发人员就可以将程序开发集中在业务和用户体验上,而 ...

  7. jQuery中的end()方法

    定义和用法 end() 方法结束当前链条中的最近的筛选操作,并将匹配元素集还原为之前的状态. 以上是官方说法,比较难理解. 还是用一个例子来说明 <!DOCTYPE html> <h ...

  8. js和JQuery中offset等属性对比

    HTML: 内容在滚动条下面 <div id="outerDiv"> <div id="myDiv" class="myDiv&qu ...

  9. jQuery中hover与mouseover和mouseout的区别分析

    本文实例分析了jQuery中hover与mouseover和mouseout的区别.分享给大家供大家参考,具体如下: 以前一直以为在jquery中其实mouseover和mouseout两个事件等于h ...

随机推荐

  1. 字符编码几个缩写 ACR CCS CEF CES TES

    摘自https://zhuanlan.zhihu.com/p/27012967 5. 在Unicode Technical Report (UTR统一码技术报告) #17<UNICODE CHA ...

  2. GUI相应鼠标事件

    function varargout = GUI18(varargin) % GUI18 MATLAB code for GUI18.fig % GUI18, by itself, creates a ...

  3. .net大型平台通过Nginx做负载均衡（Web层、中间服务层、DB层）

    .net平台下,我目前部署过的均衡负载有两种方式(iis7和Nginx),以下以Nginx为例讲解web层的均衡负载. 简介:Nginx 超越 Apache 的高性能和稳定性,使得国内使用 Nginx ...

  4. 大数据自学5-Python操作Hbase

    在Hue环境中本身是可以直接操作Hbase数据库的,但是公司的环境不知道什么原因一直提示"Api Error:timed out",进度条一直在跑,却显示不出表. 但是在CDH后台 ...

  5. shell中test命令方法详解

    test命令用法.功能:检查文件和比较值 1)判断表达式 if test  (表达式为真) if test !表达式为假 test 表达式1 –a 表达式2                 两个表达式 ...

  6. Django模板系统 运算

    记下来,省得每次google 过滤器,变量的显示形式的改变 一.形式:小写 {{ name | lower }} 二.串联:先转义文本到HTML,再转换每行到 <p> 标签 {{ my_t ...

  7. K8S学习笔记之CentOS7集群使用Chrony实现时间同步

    0x00 概述 容器集群对时间同步要求高,实际使用环境中必须确保集群中所有系统时间保持一致,openstack官方也推荐使用chrony代替ntp做时间同步. Chrony是一个开源的自由软件,像Ce ...

  8. Cookie&Session与自定义session

    cookie与session的区别? cookie是保存在浏览器端的键值对 session是保存在服务器端的键值对 session依赖于cookie 摘自: http://bubkoo.com/201 ...

  9. mysql 8.0 Druid连接时调用getServerCharset报空指针异常解决方法

    类似错误信息如下: 16:52:01.163 [Druid-ConnectionPool-Create-1641320886] ERROR com.alibaba.druid.pool.DruidDa ...

  10. Java中断异常 InterruptedException 的正确处理方式

    你看到这篇文件可能是因为你已经调用了一个抛出 InterruptedException 异常的方法,并且需要以某种方式处理它. 首先,需要了解为一个方法为啥会 throws InterruptedEx ...