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

1
2
3
window.onload = function(){
    // 当网页加载完成后执行这里的代码块
};

而在jQuery中也有一个对应的函数，即等待网页加载完后执行代码块

1
2
3
$(document).ready(function(){
    // 当网页加载完成后执行这里的代码块    
});

以上这两个看似一样的功能，但实际有很大的区别

onload不仅在创建DOM树之后，而且在所有外部资源全部加载完毕，并且整个页面在浏览器窗口中显示完毕之后，才会执行。这些资源不仅包括图片资源，而且包括嵌入在页面上的flash视频，如果图片或者flash过多，那么会一段很长加载时间，也就意味这延迟执行代码块的时间会更多。

jQuery中的ready()方法只需要等待文档结构被完全解析并且浏览器已经把HTML转化为DOM树后就会执行代码块，这里注意的是仅仅是DOM，网页中的图片，flash等外部资源都毫无关联。

由此可见jQuery中的ready()方法将缩短等待时间。

当然还有另外一种方式，就是把脚本都在<body>标签后面，这样的话网页按照文档流顺序执行，也会达到JavaScript中onload或者jQuery中ready()效果，并且这中方式将更快的展现网页内容。

jquery中read与js中onload区别的更多相关文章

  1. php中向前台js中传送一个二维数组

    在php中向前台js中传送一个二维数组,并在前台js接收获取其中值的全过程方法: (1),方法说明:现在后台将数组发送到前台 echo json_encode($result); 然后再在js页面中的 ...

  2. javascript中，一个js中的函数，第一句var _this = this;为什么要这样做？

    javascript中,一个js中的函数,第一句var _this = this;为什么要这样做? 下面是源码: 下面这段代码是常用的网站首页,自动切换span或者tabbar来变更List显示内容的 ...

  3. jq中$(function(){})和js中window.onload区别

    先看下执行代码: $(function(){   console.log("jq");}) $(function(){   console.log("jq1") ...

  4. JQuery中width和JS中JS中关于clientWidth offsetWidth scrollWidth 等的含义

    JQuery中: width()方法用于获得元素宽度: innerWidth()方法用于获得包括内边界(padding)的元素宽度: outerWidth()方法用于获得包括内边界(padding)和 ...

  5. 如何将一个对象存到网页中并在js中使用

    需求:希望在js中使用Controller传过来的对象,特别是对象里存有list的数据. 不希望循环使用隐藏域. 解决办法:在View中使用Json.Net序列化: @{ string jsonStr ...

  6. 在vue项目中的main.js中直接使用element-ui中的Message 消息提示、MessageBox 弹框、Notification 通知

    需求来源:向后台请求数据时后台挂掉了,后台响应就出现错误,不做处理界面就卡住了,这时需要在main.js中使用axios的响应拦截器在出现相应错误是给出提示.项目使用element-ui,就调用里面的 ...

  7. jquery中data()和js中dataset属性的区别

    INTRO html的标签属性data-允许用户自定义属性.原生javascript和jquery分别定义了dataset属性和data()方法对标签中的data属性进行操作. 取值: 如我们定义这样 ...

  8. unity3d中C#与JS的一些区别

    unity3d目前支持C#和JS两种脚本语言. 学习过程中发现很多教程使用的是JS语言,自己还是用C#比较多,unity原生使用的是Mono,使用C#会更加接近unity的编程思想. 1.方法的定义, ...

  9. jquery学习-document.ready和document.onload区别

    $(function(){}) 和$(document).ready(function(){}的作用一样,表示在document树加载完之后执行一个函数. $(document).onload(fun ...

随机推荐

  1. c# excel sheep 导出

    using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Da ...

  2. linux 用户空间获得纳秒级时间ns

    一.引言 我们在测试程序的性能的时候往往需要获得ns级的精确时间去衡量一个程序的性能,下面介绍下linux中用户空间获得ns级时间的方法 二.用户空间获得ns级时间 使用clock_gettime函数 ...

  3. 2.x ESL第二章习题2.5

    题目 描述 $y_i=x_i^T\beta+\epsilon_i$$\epsilon_i\sim N(0,\sigma^2)$ 已有训练集$\tau$,其中$X:n\times p,y:n\times ...

  4. hdu1258Sum It Up (DFS)

    Description Given a specified total t and a list of n integers, find all distinct sums using numbers ...

  5. linux中的strings命令简介2

    摘自:http://blog.csdn.net/stpeace/article/details/46641069 linux中的strings命令简介 之前我们聊过linux strings的用法和用 ...

  6. android 边学边记 2015.10.16

    1.Menu.FIRST在reference中描述为:First value for group and item identifier integers.我们可以理解为ID设置的最小数值. 2.se ...

  7. 新手学习.net编程计划-1

    .NET是一个庞大的学习体系,对于新手来说会感觉无从下手.学习知识必须从入门的基础学起,才能更好地掌握.学习.net也是如此,最基础的莫过于了解.net平台,以及掌握.net的基础语法C#. 本计划是 ...

  8. Storages and virtual servers

    1. IBM Storages: SONAS,V7k,V7ku,SVC,XIV 存储设备都安装了个性化定制的Linux系统,来完成不同的服务,这几台存储设备使用原理都是类似的,以SONAS (Scal ...

  9. .NET MV4 Remote远程验证注意事项及案例

    首先是模型代码 public class LoginModel { [Required] [Display(Name = "用户名")] [Remote("CheckNa ...

  10. Android开发之自定义圆角矩形图片ImageView的实现 - Jamy Cai

    android中的ImageView只能显示矩形的图片,这样一来不能满足我们其他的需求,比如要显示圆角矩形的图片,这个时候,我们就需要自定义ImageView了,其原理就是首先获取到图片的Bitmap ...