ready与load谁先执行:

大家在面试的过程中,经常会被问到一个问题:ready与load那一个先执行,那一个后执行?答案是ready先执行,load后执行。

DOM文档加载的步骤:

要想理解为什么ready先执行,load后执行就要先聊一下DOM文档加载的步骤:

1
2
3
4
5
6
解析HTML结构。
加载外部脚本和样式表文件。
解析并执行脚本代码。
构造HTML
DOM模型。
//ready
加载图片等外部文件。
页面加载完毕。//load
从上面的描述中大家应该已经理解了吧,ready在第(4)步完成之后就执行了。但是load要在第(6)步完成之后才执行。

ready事件:

ready事件在DOM结构绘制完成之后就绘执行。这样能确保就算有大量的媒体文件没加载出来,JS代码一样可以执行。

load事件:

load事件必须等到网页中所有内容全部加载完毕之后才被执行。如果一个网页中有大量的图片的话,则就会出现这种情况:网页文档已经呈现出来,但由于网页数据还没有完全加载完毕,导致load事件不能够即时被触发。

总结:

相信大家已经了解了ready与load的区别,其实如果页面中要是没有图片之类的媒体文件的话ready与load是差不多的,但是页面中有文件就不一样了,所以还是推荐大家在工作中用ready。


jQuery load()和ready()的更多相关文章

  1. jQuery学习一:jQuery中的ready和load事件

    //ready事件 $(document).ready(function(){ 代码........ }); //ready事件简写: $(function(){ 代码........ }); //l ...

  2. jQuery load()方法用法集锦!

    调用load方法的完整格式是:DE>load( url, [data], [callback] ),其中DE> DE>urlDE>:是指要导入文件的地址. DE>data ...

  3. JS的window.onload与JQuery的$(document).ready(function(){})的区别

    前段时间去面试被问及JS的加载(onload)与jQuery中加载(ready)方法的区别,瞬时懵逼了,关于这个知识点平时还真没怎么注意. 最近先来无事便查了一下资料, onload 事件(W3c上给 ...

  4. jQuery的document ready与 onload事件——你真的思考过吗?

    在进行实验和资料查询时,我遇到了几个关键问题: 1. window.onload到底是什么加载完触发? 2. body为什么会有onload事件? 3. 为什么是window.onload,而不是do ...

  5. 在 ASP.NET 中使用 jQuery.load() 方法

    今天就让我们看看在 ASP.NET 中使用 jQuery.load() 方法来调用 ASP.NET 的方法,实现无刷新的加载数据. 使用 jQuery 的朋友应该知道可以使用 jQuery.load( ...

  6. javascript的window.onload()方法和jQuery的$(document).ready()的对比

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

  7. Jquery中$(document).ready()与传统JavaScript中的window.onload方法的区别(2016/8/3)

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

  8. jQuery中的ready方法及实现按需加载css,js

    模拟jQuery中的ready方法及实现按需加载css,js 一.ready函数的实现 经常用jQuery类库或其他类库中的ready方法,有时候想想它们到底是怎么实现的,但是看了一下jQuery中的 ...

  9. jquery load加载页面内ajax返回的div不能响应页面js的问题的解决方案

    1. 前言 由于项目需要,需要load一个页面并保持ajax返回的div能响应其页面内的JS的click事件.这个不是 解决用jquery load加载页面到div时,不执行页面js的问题 这类问题, ...

随机推荐

  1. html5实现烟花绽放效果

    来源地址:http://codepen.io/whqet/pen/Auzch 1.HTML5 你懂的,先看效果: 2.Html代码 <!-- setup our canvas element - ...

  2. linux 启动 oracle数据库

    第一步:切换到oracle用户 su - oracle 第二步:启动oracle数据库监听 lsnrctl start 第三步:输入下方命令,出现:sql> sqlplus /nolog 第四步 ...

  3. iOS伪实现打地鼠游戏

    打地鼠是一款可以用iOS知识来实现的一种游戏.其核心技术就是通过imageView来播放动画,点击button时来停止当前播放的动画开始击打地鼠的动画.话不多说直接上代码. 这是添加当前的背景图片,然 ...

  4. hdu 1421 搬寝室(dp)

    Problem Description 搬寝室是很累的,xhd深有体会.时间追述2006年7月9号,那天xhd迫于无奈要从27号楼搬到3号楼,因为10号要封楼了.看着寝室里的n件物品,xhd开始发呆, ...

  5. crm使用soap创建下拉框

    //C#代码 //#region OptionMetadataCollection //OptionMetadataCollection opCollection = new OptionMetada ...

  6. Cassandra - Non-system keyspaces don't have the same replication settings, effective ownership information is meaningless

    In cassandra 2.1.4, if you run "nodetool status" without any keyspace specified, you will ...

  7. JavaScript里面三个等号和两个等号的区别

    == equality 等同,=== identity 恒等. ==, 两边值类型不同的时候,要先进行类型转换,再比较. ===,不做类型转换,类型不同的一定不等. 下面分别说明: 先说 ===,这个 ...

  8. Debug编辑通过转Release找不到命名空间

    首先查看缺少命名空间在哪个项目中 然后看缺少命名空间项目中bin/Release有没有相关文件 如果没有对该项目进行Release编译然后在编译所有项目

  9. c#中的数据类型简介

    一.C#中的变量和常量 C#中用于定义常量的方式有两种一个使用const关键字,一个是用readonly关键字.使用const定义的常量叫静态常量(compile-time constant),用re ...

  10. VB execl文件后台代码,基础语法

    Excel宏与VBA 程序设计实验指导1 实验1 Excel宏与VBA 语法基础 一.实验目的 1.熟练掌握录制宏.执行宏.加载宏的方法: 2.熟练使用Excel VBA编辑环境,掌握VBA的编辑工具 ...