Onload,$(window).load(function() {}):元素都加载完毕,才可以执行.

$(document).ready(function(){}):不一定要等所有的js和图片加载完毕,就可以执行.

 

 

我们都知道,很多时候,在页面加载完后都需要做一些相应的初始化动作.例如,运行某些js特效,设置表单等等.怎么知道页面加载完了呢?一般情况下都是设置body标签的onload监听window的load事件.但load事件是要在页面的元素全部加载完了才触发的,如果页面上图片较多或图片太大,就会导致初始化的代码未被执行的时候用户就做了其它操作了. Jquery库提供了一个非常方便好用的函数( $(selector).ready()),让我们可以在页面的dom加载完后就可以做相应的操作(当然,这还得看用户浏览器的支持).,而不用等待全部元素加载完成.例如:
$(document).ready(function (){ alert(’use in page script tag’) });
$(document).ready(function (){ alert(’use in import js file’) });
现在让我们来研究一下这个函数的实现.
原理:
在jquery脚本加载的时候,会设置一个isReady的标记,监听DOMContentLoaded事件(这个不是什么浏览器都有的,不同浏览器,jquery运作方式不一样).当然遇到调用ready函数的时候,如果isReady未被设置,那就是说页面未加载完,就会把要执行的函数用一个数组缓存起来,当页面加载完后,再把缓存的函数一一执行.(原文地址:http://blog.csdn.net/lk188/article/details/4359346)

Onload,Onunload,onbeforeunload,$(window).load(function() {})和$(document).ready(function(){})的更多相关文章

  1. $(function(){}) ,$(document).ready(function(){}),window.onload = function(){...},$(window).load(function(){...})区别

    1. 写法:      $(function(){}) ,$(document).ready(function(){})是一样的 2. 时间: window.onload和$(window).load ...

  2. $(window).load(function() {})和$(document).ready(function(){})的区别

    JavaScript 中的以下代码 : Window.onload = function (){// 代码 }  等价于  Jquery 代码如下: $(window).load(function ( ...

  3. jQuery的$(window).load与、(document).ready和window.onload的关系

    jQuery的$(window).load与.(document).ready和window.onload的关系 $(function() { console.log('document.ready ...

  4. JQuery $(function(){})和$(document).ready(function(){})

    document.ready和onload的区别——JavaScript文档加载完成事件页面加载完成有两种事件一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件)二是onload,指 ...

  5. $(function(){})和$(document).ready(function(){}) 的用法

    当文档载入完毕就执行,以下几种效果是等价的:1. $(function(){ //这个就是jQuery ready()的简写,即下2的简写 // do something }); 2. $(docum ...

  6. $(function(){})和$(document).ready(function(){})

    document.ready和onload的区别——JavaScript文档加载完成事件 页面加载完成有两种事件 一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件) 二是onloa ...

  7. 转:jquery的$(function(){})和$(document).ready(function(){}) 的区别

    原文链接:https://www.cnblogs.com/slyzly/articles/7809935.html [转载]jquery的$(function(){})和$(document).rea ...

  8. 比较body.onload(function())、$(document).ready(function())与$(windows).load(function)

    原理对比: body.onload(function())是优先将document的DOM渲染,即将页面所有的元素(包括html标签以及所引用到的图片,flash媒体等媒体文件)加载完成,然后再执行页 ...

  9. $(window).on("load",function(){} 和 $(document).ready(function() {}

    $(window).on("load",function(){ //页面属性,图片,内容完全加载完,执行 } $(document).ready(function() { 或者$( ...

随机推荐

  1. Interview----求 1+2+...+n, 不能用乘除法、for、while if、else、switch、case 等关键字以及条件判断语句 (A?B:C)

    题目描述: 求 1+2+...+n, 要求不能使用乘除法.for.while.if.else.switch.case 等关键字以及条件判断语句 (A?B:C). 分析: 首先想到的是写递归函数,但是遇 ...

  2. OC中修饰符:宏define 常量:const extern

    const const最好理解,修饰的东西不能被修改 指针类型根据位置的不同可以理解成3种情况: I 常量指针 // 初始化之后不能赋值,指向的对象可以是任意对象,对象可变. NSString * c ...

  3. 用C语言实现评论系统设计 - 无数据库版

  4. Java 解惑:Random 种子的作用、含参与不含参构造函数区别

    Random 通常用来作为随机数生成器,它有两个构造方法: Random random = new Random(); Random random2 = new Random(50); 1.不含参构造 ...

  5. C# 封装一个钩子类

    利用C#设置钩子函数,并封装成类.如果想要实现全局钩子的话,必须将实现的代码封装到类库里. using System; using System.Collections.Generic; using ...

  6. JavaScript 经常忽略的 7 个基础知识点

    1. 在 String.prototype.replace 方法中使用 /g 和 /i标志位 令很多 JavaScript 初学者意外的是,字符串的 replace 方法并不会 替换所有匹配的子串—— ...

  7. Math中floor,round和ceil的区别

    floor 返回不大于的最大整数 round 则是4舍5入的计算,入的时候是到大于它的整数(当-1.5时可见,四舍五入后得到的结果不是我们期待的,解决办法是先对他取绝对值,然后在用round方法) r ...

  8. 设计模式:Strategy 策略模式 -- 行为型

    设计模式 策略模式Strategy(对象行为型) 这是几年前写的文字(转载做的笔记更准确些),发觉还是废话多了点. 其实,核心就是5.结构中的UML图 5.1 和 5.2(新增).现在看这张图就觉得一 ...

  9. 解决load 函数无法赋予变量名的问题

    以前非常喜欢使用load函数,因为简单,而且存储相对较大的matrix.list文件更为方便.但是load函数有一个问题是在使用其过程中无法对其载入的data赋予变量名: # save data x ...

  10. 创建数据库时报"FILESTREAM 功能被禁用"

    问题,创建含有FileStream数据库时报"FILESTREAM 功能被禁用" 解决方式 修改数据库属性 打开管理配置工具,右键打开sql server的属性,查看FILESTR ...