jquery $(document).ready()和window.onload的区别浅析

 更新时间:2015年02月04日 11:25:35   转载 投稿:junjie  
这篇文章主要介绍了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(){});

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

复制代码 代码如下:

$(document).ready(function(){

});

这个时候,不一定要等所有的js和图片加载完毕,就可以执行一些方法,不过有些时候,必须要等所有的

元素都加载完毕,才可以执行一些方法的时候,比如说,部分图片或者什么其他方面还没有加载好,这个时候,点击某些按钮,会导致出现意外的情况,这个时候,就

需要用到:

复制代码 代码如下:

$(window).load(function() {

});

总结对比:

相关文章

  • JS实现将对象转化为数组的方法分析

    JS实现将对象转化为数组的方法分析

    这篇文章主要介绍了JS实现将对象转化为数组的方法,结合实例形式分析了javascript操作及转换json数组相关实现技巧,需要的朋友可以参考下
    2019-01-01
  • javascript将16进制的字符串转换为10进制整数hex

    javascript将16进制的字符串转换为10进制整数hex

    这篇文章主要介绍了javascript将16进制的字符串转换为10进制整数hex,需要的朋友可以参考下
    2020-03-03
  • 关于Bootstrap弹出框无法调用问题的解决办法

    关于Bootstrap弹出框无法调用问题的解决办法

    这篇文章主要介绍了关于Bootstrap弹出框无法调用问题的解决办法的相关资料,需要的朋友可以参考下
    2016-03-03
  • JavaScript中的连续赋值问题实例分析

    JavaScript中的连续赋值问题实例分析

    这篇文章主要介绍了JavaScript中的连续赋值问题,结合实例形式分析了javascript赋值语句以及连续赋值操作相关用法与操作注意事项,需要的朋友可以参考下
    2019-07-07
  • ionic进入多级目录后隐藏底部导航栏(tabs)的完美解决方案

    ionic进入多级目录后隐藏底部导航栏(tabs)的完美解决方案

    这篇文章主要介绍了ionic进入多级目录后隐藏底部导航栏(tabs)的完美解决方案,在文章中用到了angularjs的指令知识点,对ionic隐藏底部导航栏知识感兴趣的朋友一起学习吧
    2016-11-11
  • 用js实现放大镜的效果的简单实例

    用js实现放大镜的效果的简单实例

    下面小编就为大家带来一篇用js实现放大镜的效果的简单实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-05-05
  • 网页中的图片查看器viewjs使用方法

    网页中的图片查看器viewjs使用方法

    下面小编就为大家带来一篇网页中的图片查看器viewjs使用方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-07-07
  • Js判断CSS文件加载完毕的具体实现

    Js判断CSS文件加载完毕的具体实现

    在多数情况下我们不需要判断css文件是否加载成功了,但有些时间这个功能还是需要的,今天我来整理了兼容各种浏览器的判断CSS文件加载完毕实现方法与各位分享
    2014-01-01
  • 令按钮悬浮在(手机)页面底部的实现方法

    令按钮悬浮在(手机)页面底部的实现方法

    下面小编就为大家带来一篇令按钮悬浮在(手机)页面底部的实现方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-05-05
  • JavaScript中立即执行函数实例详解

    JavaScript中立即执行函数实例详解

    javascript和其他编程语言相比比较随意,所以javascript代码中充满各种奇葩的写法,有时雾里看花,当然,能理解各型各色的写法也是对javascript语言特性更进一步的深入理解。这篇文章主要给大家介绍了关于JavaScript中立即执行函数的相关资料,需要的朋友可以参考下。
    2017-11-11

最新评论