window.onload和document.ready虽然两个方法的运行效果都一样,但他们之间是存在着区别的:

  一、从执行的时间

    window.onload在dom文档结构加载完毕以后就可以执行,不必等到页面中的其他文件(例如图片等文件)都加载完毕。

    而document.ready则是必须要等到dom文档结构和其他包括图片在内放入所有文件全部加载成功后才可以执行

  二、编写个数,被执行的次数不同

    window.onload不能通知书编写多个,就算写了多个,也只能执行一个;

    document.ready可以编写多个,并且可以全部执行

  三、执行顺序

    由于document.ready和window.onload执行时间原因导致,document.ready要比window.onload先执行

    可以执行以下代码,验证结果:   

       window.onload = function () {
                alert('onload');
            };
            document.ready(function () {
                alert('ready');
           });
     运行这段代码可以发现,浏览器页面会先弹出ready,后弹出onlaod
    

window.onload和document.ready的区别的更多相关文章

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

    window.onload和$(document).ready()的区别,如下表所示   window.onload $(document).ready() 执行时间 在页面所有内容(图片.文件)加载 ...

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

    以浏览器装载文档为例,在页面加载完毕后,浏览器会通过 JavaScript 为 DOM 元素添加事件.在常规的 JavaScript 代码中,通常使用 window.onload 方法 ,而在 jQu ...

  3. 浏览器加载模式:window.onload和$(document).ready()的区别(详解)

    jQuery库文件是在body元素之前加载的,必须等待所有的DOM元素加载后,延迟支持DOM操作,否则就无法获取到. 在延迟等待加载,JavaScript提供了一个事件为load,方法如下: wind ...

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

    对于很多初学者来说,window.onload出现在代码中的频率非常高,这似乎变成了一种习惯,可是并不知道具体为什么要加这句代码,可以做几个试验对比: 实验一: <script> docu ...

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

    ... 在Stack Overflow上看到了这个问题,自己翻译了过来. The onload event is a standard event in the DOM, while the read ...

  6. window.onload与document.ready的区别

    1. window.onload必须等到网页中所有的内容加载完(包含图片)才执行 document.ready网页中所有DOM结构绘制完执行,可能DOM并没有加载完 所有document.ready比 ...

  7. window.onload与$(document).ready()之区别

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

  8. window.onload()和$(document).ready的区别( $(document).ready == $(function(){ }) )

    首先$(function(){}) 和 $(document).ready(function(){}) 是一个方法,$(function(){})为简写(用的多) $(document).ready和 ...

  9. window.onload和$(document).ready(function(){})的区别

    前段时间在面试之前查找并整理了一下window.onload和$(document).ready(function(){})区别,今天有时间更到我的博客上,由于本人资历尚浅,如有不对的地方,还请指正. ...

随机推荐

  1. 利用Django框架实现分页 demo

  2. Codeforces Round #596 Div1 A~E题解

    我好菜啊 A 题意: 定义p-二进制数为2^k-p,给出n和p,求用最小个数的p-二进制数来表示n 1<=n<=10^9,-1000<=p<=1000 题解: 猜结论,答案不会 ...

  3. requiredBackgroundModes

    申明需要后台运行的能力,类型为数组.目前支持以下项目: audio: 后台音乐播放如: { "pages": ["pages/index/index"], &q ...

  4. onmouseover和onmouseout鼠标移入移出切换图片的几种实现方法

    鼠标移入移出图片切换很常见的,那我们就来说说他的写法 第一种方法,也是最简单的一种,在html:里就可实现 <img class="img" src="img/do ...

  5. RedisTemplate访问Redis数据结构(前言)

    Redis五种基本数据结构 redis提供键值对的形式对数据进行存储.支持五种数据类型:String(字符串),List(链表),Hash(散列),Set(无序集合),ZSet(有序集合).下面是网上 ...

  6. [HDU6403]:Card Game(dfs+DP+基环树)

    题目传送门 题目描述 她依然在我不知道的地方做我不知道的事.桌面上摊开着一些卡牌,这是她平时很爱玩的一个游戏.如今卡牌还在,她却不在我身边.不知不觉,我翻开了卡牌,回忆起了当时一起玩卡牌的那段时间.每 ...

  7. 利用python进行数据分析--numpy基础

    随书练习,第四章  NumPy基础:数组和矢量运算 # coding: utf-8 # In[1]: # 加注释的三个方法1.用一对"""括起来要注释的代码块. # 2. ...

  8. Kaggle 入门资料

    kaggle入门之如何使用 - CSDN博客 http://blog.csdn.net/mdjxy63/article/details/78221955 kaggle比赛之路(一) -- 新手注册账号 ...

  9. 力扣60——第k个排列

    原题 给出集合 [1,2,3,-,n],其所有元素共有 n! 种排列. 按大小顺序列出所有排列情况,并一一标记,当 n = 3 时, 所有排列如下: 1. "123" 2. &qu ...

  10. 我用HTML写简历

    本文属于原创文章,转载请注明--来自桃源小盼的博客 起因 每次换工作写简历都是有点痛苦的事情,尤其是下载word模板,各种注册流程,有的还得买积分,冲会员,甚是不爽.就算下载好了,修改其中的一些细节也 ...