Jquery的ready()与Javascrpit的load()

1 window.onload() $(document).ready()
加载时机 必须等待网页全部加载完毕(包括图片等),然后再执行JS代码 只需要等待网页中的DOM结构加载完毕,就能执行JS代码
执行次数 只能执行一次,如果第二次,那么第一次的执行会被覆盖 可以执行多次,第N次都不会被上一次覆盖
举例

以下代码无法正确执行:

window.onload = function() { alert(“text1”);};
 
window.onload = function() { alert(“text2”);};

结果只输出第二个

结果只输出第二个

$(document).ready(function(){alert(“Hello”)});
 
$(document).ready(function(){alert(“Hello”)});

结果两次都输出

简写方案 $(function () {})

一般情况下window的load()都是用来设置body标签的onload事件.但onload事件是要在页面的元素全部加载完了才触发的,这也包括页面上的图片,以及大的表格数据。如果页面上图片较多或图片太大,加载需要较多时间,就会导致页面无响应,或者用户做了其它操作了。

而Jeuery中的ready()则是在页面的dom(节点)加载完后就可以做相应的操作,而不用等待全部元素加载完成.比如只知道页面某处有一张图片,而不一定要等它显示出来就可以为它绑定点击方法。

https://www.cnblogs.com/wsun/p/3916487.html

前端中onload与ready的区别的更多相关文章

  1. jQuery中onload与ready区别

    onload和ready的区别document.ready和onload的区别为:加载程度不同.执行次数不同.执行速度不同.1.加载程度不同 document.ready:是DOM结构绘制完毕后就执行 ...

  2. onload和ready的区别

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

  3. js/jQuery中load()、onload()、ready()的区别

    一.两大事件 load事件:指页面包含图片等文件在内的所有元素都加载完毕后执行的事件. ready事件:表示文档结构已加载完成(不包括图片等非文字媒体文件) 浏览器页面渲染的过程 - 寸寸君 - 博客 ...

  4. jquery中的$(document).ready()、JavaScript中的window.onload()以及body中的onload()的区别

      body中的onload()和window.onload以及$(document).ready()的区别: 1.前两者都表示当页面加载元素(包括图片等信息)完毕后执行的操作,而且两者在各种浏览器中 ...

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

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

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

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

  7. jquery中read与js中onload区别

    在JavaScript中,onload函数是最经常使用的,几乎涉及到JavaScript的童鞋都少不了要接触它.这个函数的作用就是等待网页完全装载完了以后再去执行代码块内的语句,因为按照文档流的执行顺 ...

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

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

  9. 【Python全栈-JavaScript】JavaScript的window.onload()与jQuery 的ready()的区别

    JavaScript的window.onload()与jQuery 的ready()的区别 做web开发时常用Jquery中$(document).ready()和JavaScript中的window ...

随机推荐

  1. linux 下 进程和线程的区别

    1.进程与线程 进程是程序执行时的一个实例,即它是程序已经执行到课中程度的数据结构的汇集.从内核的观点看,进程的目的就是担当分配系统资源(CPU时间.内存等)的基本单位. 线程是进程的一个执行流,是C ...

  2. Angular2快速入门-3.多个组件(分离新闻列表页和详细页)

    上篇(Angular2快速入门-2.创建一个新闻列表)已经完成新闻列表的展示,并且点击新闻列表的时候,下面可以展示出新闻的详细信息,这节我们把新闻详细和新闻列表页面分离出来 新闻详细单独一个compo ...

  3. Python Twisted系列教程11:改进诗歌下载服务器

    作者:dave@http://krondo.com/your-poetry-is-served/ 译者:杨晓伟(采用意译) 你可以从这里从头阅读这个系列. 诗歌下载服务器 到目前为止,我们已经学习了大 ...

  4. BGP基本配置的方法

    边界网关协议(BGP)是运行于 TCP 上的一种自治系统的路由协议. BGP 是唯一一个用来处理像因特网大小的网络的协议,也是唯一能够妥善处理好不相关路由域间的多路连接的协议. as100 as200 ...

  5. 一些c++

    1.static 静态局部对象: 一旦被创建,在程序结束前都不会被撤销.当定义静态局部对象的函数结束时,静态局部对象不会撤销. 2.内联函数: 避免函数调用的开销. 在函数返回类型前加上关键字 inl ...

  6. MVC,MVP 和 MVVM 的详解

    一.MVC MVC模式的意思是,软件可以分成三个部分. 视图(View):用户界面. 控制器(Controller):业务逻辑 模型(Model):数据保存 各部分之间的通信方式如下. View 传送 ...

  7. codeforeces:Mister B and Astronomers分析和实现

    题目很长,稍微翻译一下: 外星球每隔T秒中只有一秒可以被观测到,其它T-1秒无法被观测.n个天文学家(分别编号为1,...,n)轮流观测天空1秒,且第i+1个科学家在第i个天文学家后ai+1秒后才执行 ...

  8. iBase4j前端01_bootstrap-suggest json-server模拟后台数据、bootstrap-suggest环境搭建、开启bootstrap-suggest的post和put请求

    1 准备 1.1 模拟的json数据 { "info": [ { "message": "信息", "value": [ ...

  9. Java-Http

    1 import java.io.BufferedReader; 2 import java.io.BufferedWriter; 3 import java.io.IOException; 4 im ...

  10. jsp Ajax请求(返回html标签)

    <?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi="http:// ...