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

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#/.NET基于Topshelf创建Windows服务程序及服务的安装和卸载(极速，简洁)

    本文首发于:码友网--一个专注.NET/.NET Core开发的编程爱好者社区. 文章目录 C#/.NET基于Topshelf创建Windows服务的系列文章目录: C#/.NET基于Topshelf ...

  2. Django之 Form和ModelForm组件

    01-Form介绍 我们之前在HTML页面中利用form表单向后端提交数据时,都会写一些获取用户输入的标签并且用form标签把它们包起来. 与此同时我们在好多场景下都需要对用户的输入做校验,比如校验用 ...

  3. c语言之数据类型

    #include<stdio.h> int main(void) { float weight, value; printf("Are you worth your weight ...

  4. 控制结构(5): 必经之地（using）

    // 上一篇:局部化(localization) // 下一篇:最近最少使用(LRU) 基于语言提供的基本控制结构,更好地组织和表达程序,需要良好的控制结构. 前情回顾 上一周,我们谈到了分支/卫语句 ...

  5. [转帖]Ansible 入门秘诀

    Ansible 入门秘诀 作者: Jose Delarosa 译者: LCTT jdh8383 | 2019-03-08 09:24   收藏: 2 用 Ansible 自动化你的数据中心的关键点. ...

  6. git安装和GitHub使用

    一.git安装 1.git下载 https://github.com/git-for-windows/git/releases/tag/v2.17.1.windows.2 在如上地址下载git,并安装 ...

  7. 进程间通信(队列、管道)、消费者模型和进程池(apply,apply_async,map)

    一.队列(先进先出) 进程间通信:IPC(Inter-Process Communication) 队列是使用管道和锁定实现,所以Queue是多进程安全的队列,使用Queue可以实现多进程之间的数据传 ...

  8. jzoj6101. 【GDOI2019模拟2019.4.2】Path

    题目链接:https://jzoj.net/senior/#main/show/6101 记\(f_i\)为从\(i\)号点走到\(n\)号点所花天数的期望 那么根据\(m\)条边等可能的出现一条和一 ...

  9. mybatis返回结果封装为map的探索

    需求 根据课程id 列表,查询每个课程id的总数,放到一个map里 最简单的就是循环遍历,每一个都查询一次网上说mybatis可以返回Map 和 List<Map>两种类型 尝试 直接返回 ...

  10. centos安装node环境

    一.安装wget yum install -y wget 二.下载node最新的安装包 wget https://nodejs.org/dist/v10.13.0/node-v10.13.0-linu ...