不谈调用次数，加载先后问题，只看渲染时区别

1、都在数据绑定完加载。

2、ready可以有多个，且都执行，onload虽可以写多个，但是只执行最后一个。

3、 $.ready = function () {} 和  $(document).ready()不同， $.ready类似于onload，多个的话只会执行最后一个，并且和$(document).ready()同是写的话会覆盖$(document).ready()；但是和$(document).ready()类似的是，等dom元素绘制完就执行，不必等所有元素（图片）加载完。

<!DOCTYPE html>

<html>

<head>

    <title>ready 和 onload()的区别</title>

</head>

<body>

    <p>论一个人的心胸</p>

    <img src="http://pic1.win4000.com/wallpaper/e/526c9f87129d9.jpg" />

    <img src="http://fj2.eastday.com/hdqxb2013/20130823_7/node757990/images/02347082.jpg" />

    <img src="http://pic25.nipic.com/20121210/7447430_215152474000_2.jpg" />

    <img src="http://www.ftourusa.com/uploads/allimg/120709/10-120F91156331I.jpg" />

    <img src="http://pic1.win4000.com/wallpaper/a/5822ec48466e9.jpg" />

    <img src="http://pic1.win4000.com/wallpaper/a/5822ec4e20a0d.jpg" />

    <img src="http://www.sinaimg.cn/dy/slidenews/4_img/2010_12/703_34324_811130.jpg" />

    <img src="http://www.cecet.cn/upimg/allimg/100727/1124SUQ4.jpg" />

    <img src="http://img1.cache.netease.com/catchpic/9/95/959D16A04C3C267B26A0032091AA7F70.jpg" />

    <img src="http://www.meijialx.com/images/122547_media_20071310386.jpg" />

    <img src="http://img15.3lian.com/2015/h1/21/d/28.jpg" />

    <img src="http://img1.3lian.com/2015/a1/147/d/7.jpg" />

    <img src="http://img.tuku.cn/file_thumb/201601/m2016012815305053.jpg" />

    <img src="http://pic25.nipic.com/20121210/7447430_215152474000_2.jpg" />

    <img src="http://www.ftourusa.com/uploads/allimg/120709/10-120F91156331I.jpg" />

    <img src="http://pic1.win4000.com/wallpaper/a/5822ec48466e9.jpg" />

    <img src="http://pic1.win4000.com/wallpaper/a/5822ec4e20a0d.jpg" />

    <img src="http://www.sinaimg.cn/dy/slidenews/4_img/2010_12/703_34324_811130.jpg" />

    <img src="http://www.cecet.cn/upimg/allimg/100727/1124SUQ4.jpg" />

    <img src="http://img1.cache.netease.com/catchpic/9/95/959D16A04C3C267B26A0032091AA7F70.jpg" />

    <img src="http://www.meijialx.com/images/122547_media_20071310386.jpg" />

    <script src="https://cdn.bootcss.com/jquery/2.1.4/jquery.min.js"></script>

    <script type="text/javascript">

        window.onload = function () {

            alert("我说onload函数");

        }

        $(document).ready(function () {

            alert("第一次document.ready");

        })

        $(document).ready(function () {

            alert("第二次document.ready");

        })

        $.ready = function () {

            alert("第三次加载ready函数");

        }

        $.ready = function () {

            alert("第四次加载ready函数");

        }

        window.onload = function () {

            alert("我是第二次加载onload函数");

        }

    </script>

</body>

</html>

简单示例

自己使用时碰到的区别就这些，其他的大差不差，可以自己再搜下确认。

加载先后顺序：

document.ready方法在DOM树加载完成后就会执行，而window.onload是在页面资源（比如图片和媒体资源，它们的加载速度远慢于DOM的加载速度）加载完成之后才执行。也就是说$(document).ready要比window.onload先执行。

参考：https://baijiahao.baidu.com/s?id=1613225567743061589&wfr=spider&for=pc

随机推荐

  1. C# 读写本地配置文件

    1.在本地有一个如下配置文件 2.读写本地配置文件 3.对配置文件的内容进行操作

  2. WebApi的自定义Filter

    using System; using System.Collections.Generic; using System.Linq; using System.Net.Http; using Syst ...

  3. Raft与MongoDB复制集协议比较

    在一文搞懂raft算法一文中,从raft论文出发,详细介绍了raft的工作流程以及对特殊情况的处理.但算法.协议这种偏抽象的东西,仅仅看论文还是比较难以掌握的,需要看看在工业界的具体实现.本文关注Mo ...

  4. 偶现bug如何处理？

    请先允许我对此类bug进行吐槽,相信做测试的同学都碰见过这种bug! 我们在测试过程中经常会碰见一类很头疼的bug,就是偶现性的bug,所谓偶现性,是相对于必现而言,这类bug有些可以有重现路径,但是 ...

  5. 《React Native 精解与实战》书籍连载「Android 平台与 React Native 混合开发」

    此文是我的出版书籍<React Native 精解与实战>连载分享,此书由机械工业出版社出版,书中详解了 React Native 框架底层原理.React Native 组件布局.组件与 ...

  6. centos系统java后台运行（xshll关掉不至于jar程序结束）

    这样执行,就可以后台运行java程序 nohup java -Dfile.encoding=UTF-8 -jar xxx.jar  & 后台内容在该目录下nohup .out文件内,netst ...

  7. Linux slave配置

    说明:master机器为Windows,现将一台Linux机器作为slave进行配置.这台Linux机器为CentOS. 1.在Linux slave上的配置 ①创建名为jenkins用户 #sudo ...

  8. Spring表达式语言SpEL

    Spring表达式语言,简称SpEL,是一个支持运行时查询和操作对象图的强大的表达式语言.语法类似于EL:SpEL使用#{…}作为定界符,所有在大括号中的字符都将被认为是SpEL SpEL为bean属 ...

  9. react性能优化

    前面的话 本文将详细介绍react性能优化 避免重复渲染 当一个组件的props或者state改变时,React通过比较新返回的元素和之前渲染的元素来决定是否有必要更新实际的DOM.当他们不相等时,R ...

  10. Visualize Code with Visual Studio

    In this post, App Dev Manager Ed Tovsen spotlight the features and benefits of Code Maps in Visual S ...