jQuery库文件是在body元素之前加载的,必须等待所有的DOM元素加载后,延迟支持DOM操作,否则就无法获取到。

在延迟等待加载,JavaScript提供了一个事件为load,方法如下:

window.onload = function () {}; //JavaScript等待加载

$(document).ready(function () {}); //jQuery等待加载load和ready区别

window.onload

$(document).ready()

执行时机

必须等待网页全部加载完毕(包括

图片等),然后再执行JS代码

只需要等待网页中的DOM结构

加载完毕,就能执行JS代码

执行次数

只能执行一次,如果第二次,那么

第一次的执行会被覆盖

可以执行多次,第N次都不会被上

一次覆盖

简写方案

$(function () {})

在实际应用中,window.onload很少直接去使用,因为他需要等待图片之类的大型元素加载完毕后才能执行JS代码。遇到网速慢或者存在大的图片要下载时,页面已经全面展开,图片还在缓慢加载,这时页面上任何的JS交互功能全部处在假死状态。并且只能执行单次在多次开发和团队开发中会带来困难。

浏览器加载模式:window.onload和$(document).ready()的区别(详解)的更多相关文章

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

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

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

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

  3. window.onload和document.ready的区别

    window.onload和document.ready虽然两个方法的运行效果都一样,但他们之间是存在着区别的: 一.从执行的时间 window.onload在dom文档结构加载完毕以后就可以执行,不 ...

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

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

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

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

  6. 页面加载之window.onload=function(){} 和 $(function(){})的区别

    通用的页面加载js有四种方式: 1.window.onload = function(){}; —-js 2.$(window).load(function(){});——Jquery 3.$(doc ...

  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. 【jQuery】window.onload 和 $(document).ready() 的区别

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

随机推荐

  1. Xcode5 配置 github

    首先,要在github上,进行如下的操作: 1. github 官网 https://github.com  注册github账号. 2. 创建一个repository,命名为项目的名称,如 Gith ...

  2. oc特有语法

    分类 问题 1.什么是分类? 就是把一个类的功能,分出一部分来放在一个独立的文件中 2.分类的语法是什么样的? @interface Person(SuperMan) 3.分类与类是什么关系? 分类依 ...

  3. C# 调用c++报错可能性分析

    1.在调用之前,可以用工具(Dependency)检测下c++库所依赖的文件,看是否有错误.如果有错误,请先下补充所需运行环境. 2.如果c++ 函数 形参需要C#传入结构体,可如下: [Struct ...

  4. oracle中闪回错误的dml操作原理

    原理: Oracle根据还原表空间信息,利用还原表空间中的数据,类似一致性读取方法,可以把表置于一个删除前的时间点(或SCN),从而将数据找回. 删除删除错误的dml操作的oracle的前提准备: 一 ...

  5. c#接口定义与应用

    public interface IBankAccount //只能加public修饰符,或者什么都不加 { void Playin(decimal money); //函数前不加任何修饰符号 boo ...

  6. virtual box Failed to load unit ""pgm" 的error

    原因:没有正常的待机或者关机退出. 解决办法:右键清除保存状况.

  7. Linux基本命令(开发常用的、电脑常用的)

    一.开发常用的 ###转自:http://www.weixuehao.com/archives/25#usergroup 转自:http://blog.csdn.net/ljianhui/articl ...

  8. 命令行解释器(shell)

    unix> ./hello hello world unix> ll 显示当前目录下文件信息. shell为命令行解释器,第一个单词可以是内置的外壳命令,也可以是一个可执行文件名.

  9. 关键路径(CriticalPath)算法

    #include <stdio.h> #include <stdlib.h> #include <malloc.h> #define MAXVEX 30 //最大顶 ...

  10. Valentino发布2013秋冬高级定制系列_菁华时尚生活,时尚生活电子杂志,Fine Born China

    Valentino发布2013秋冬高级定制系列_菁华时尚生活,时尚生活电子杂志,Fine Born China alentino发布2013秋冬高级定制系列 编辑: Mavis 图源于网络 图源于网络 ...