浅析$(function) ready和onload 的区别

新手接触javascript、jquery的时候不可避免的要接触题目所标识的相关内容，反复看过几次一到用的时候总是不踏实，写此文以记之。

　　符号“$”是jquery对象(个人这样理解，拥有函数的用法)。接着知道下面的一个等式，功能性能上是完全一致的。

$(function(){ /*do some thing*/ }) = $(document).ready(function(){/* do some thing */}) = $().ready(function(){ /* do some thing */ });

　　上面是jquery中的东西，接着说下原生javascript中的，有window.onload和<body onload=""> 这两个，是存在一定区别的，使用匿名函数以及非匿名函数等会有不同，我暂时用不到所以没有做试验，网上是众说纷纭，不一致。 但是onload与jquery中的ready是不同的，这里面说下：

　　一个是次数不同，$().ready()在一个一个html中可以使用多次，onload只能使用一次或者说有效绑定只能是唯一的一个。

　　另一个是执行时机的不同，简单讲$()执行的时机要早于onload，因为$()只要在DOM树加载完成就执行，onload要在全部的元素加载完成执行。

以上所述是小编给大家介绍的$(function) ready和onload 的区别介绍，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的，在此也非常感谢大家对我们网站的支持！

赞 (0)

相关推荐

  • 一张表格告诉你windows.onload()与$(document).ready()的区别

    浏览器加载完DOM后,会通过javascript为DOM元素添加事件,在javascript中,通常使用window.onload()方法. 在jquery中,则使用$(document).ready()方法.下面介绍一下两者的区别.   window.onload() $(document).ready() 执行时机 在页面所有元素(包括图片,引用文件)加载完后执行. 页面中所有HTML DOM,CSS DOM结构加载完之后就会执行,其他图片可能没有加载完. 如果想要网页所有内容(包括图片等)

  • Jquery中"$(document).ready(function(){ })"函数的使用详解

    Jquery是优秀的Javascrīpt框架,$是jquery库的申明,它很不稳定(我就常遇上),换一种稳定的写法jQuery.noConflict(); jQuery(document).ready(function(){}); 使用jQuery的好处是它包装了各种浏览器版本对DOM对象(javascript的DOM对象你应该知道吧,就是它了)的操作. 比如jquery写法:$("div p"); // (1)$("div.container"); // (2)$

  • jquery $(document).ready()和window.onload的区别浅析

    jquery $(document).ready()和window.onload的区别浅析

    Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法,不过与window.onload方法还是有区别的. 1.执行时间         window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行.         $(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕. 2.编写个数不同          window.onload不能同时编写多个,如果有多个window.onl

  • window.onload和$(function(){})的区别介绍

    复制代码 代码如下: window.onload=function{} 表示页面加载完了后(包括dom和js),再执行函数里面的内容: 复制代码 代码如下: $(function(){}) 表示页面(dom)加载完了后,再执行函数里面的内容

  • $(document).ready(function() {})不执行初始化脚本

    今天发现一个页面始终不执行初始化脚本,代码如下: <script type="text/javascript" src="Script/jquery-1.11.1.min.js" /> <script type="text/javascript"> $(document).ready(function() { alert(1); }); </script> 后来发现问题仅仅是因为引用JQuery的时候闭合写法问

  • JQuery的ready函数与JS的onload的区别详解

    JQuery的ready函数与JS的onload的区别:1.执行时间window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行.$(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕. 2.编写个数不同window.onload不能同时编写多个,如果有多个window.onload方法,只会执行一个$(document).ready()可以同时编写多个,并且都可以得到执行 3.简化写法window.onload没有简化写法$(document).r

  • jQuery中的ready函数与window.onload谁先执行

    A.关于$(document).ready(): jquery中的$(document).ready(),那$(document).ready()到底是什么作用呢?是不是可以用window.onload = function(){ ... }来实现呢? 这里,我们要明确二者之间的区别. 我们使用window.onload = function(){ ... },是希望在页面被载入时执行function中的处理,但是这些JS代码只有在页面上的全部内容加载完成(包括头部的banner广告,所有图片)

  • 浅析document.ready和window.onload的区别讲解

    Javascript 只有在DOM元素已经定义以后才可以对其执行某种操作,这个问题在"javascript执行顺序里"http://www.jb51.net/article/44577.htm一文里有详细介绍. jQuery使用document.ready来保证所要执行的代码是在DOM元素被加载完成的情况下执行.比如在"jQuery基础 - 如何开始"一文里,我用到如下jQuery代码: 复制代码 代码如下: <!--   $(document).ready(

  • JQuery onload、ready概念介绍及使用方法

    页面加载完成有两种事件,一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件),二是onload,指示页 面包含图片等文件在内的所有元素都加载完成.(可以说:ready 在onload 前加载!!!) 一般样式控制的,比如图片大小控制放在onload 里面加载; jS事件触发的方法,可以在ready 里面加载; 用jQ的人很多人都是这么开始写脚本的: 通常的写法 复制代码 代码如下: $(function(){ // do something }); 其实这个就是jq ready

  • 浅析$(function) ready和onload 的区别

    新手接触javascript.jquery的时候不可避免的要接触题目所标识的相关内容,反复看过几次一到用的时候总是不踏实,写此文以记之. 符号"$"是jquery对象(个人这样理解,拥有函数的用法).接着知道下面的一个等式,功能性能上是完全一致的. $(function(){ /*do some thing*/ }) = $(document).ready(function(){/* do some thing */}) = $().ready(function(){ /* do so

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

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

    1.执行时间 window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行.         $(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕. 2.编写个数不同 window.onload不能同时编写多个,如果有多个window.onload方法,只会执行一个          $(document).ready()可以同时编写多个,并且都可以得到执行 3.简化写法 window.onload没有简化写法          $(documen

  • jQuery ready()和onload的加载耗时分析

    jQuery ready()和onload的加载耗时分析

    本文实例讲述了jQuery ready()和onload的加载耗时.分享给大家供大家参考,具体如下: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script src="js/jquery-1.10.1.min.js" typ

  • jquery中的$(document).ready()与window.onload的区别

    所以如果某个图片或者其他资源加载很长时间, 访问者就会看到一个不完整的页面, 甚至在图片加载之前就执行了需要依赖动态添加的元素的脚本而导致脚本错误.window.onload = function() { testDiv.innerHTML = "<div style=\"border:solid 1px #FF0000\">动态创建的div</div>"; } 解决办法就是等DOM被解析后, 在图像和外部资源加载之前执行我们的函数.在jQu

  • Jquery知识点一 Jquery的ready和Dom的onload的区别

    所以相对来说jquery的ready可以提高网页的响应速度; jquery:ready的标准写法: 复制代码 代码如下: $(document).ready(function() { alert("加载结束"); }); 一个$(document)将dom对象的document转化为jquery对象,继而可以调用jquery的方法ready();因为dom对象是不可以调用jquery的方法的,虽然他们的关系很亲密: jquery:ready的简写形式: 复制代码 代码如下: $(fun

  • jquery的$(document).ready()和onload的加载顺序

    最近在改一个嵌入在frame中的页面的时候,使用了jquery做效果,而页面本身也绑定了onload事件.改完后,Firefox下测试正常流畅,IE下就要等个十几秒jquery的效果才出现,黄花菜都凉了. 起初以为是和本身onload加载的方法冲突.网上普遍的说法是$(document).ready()是在页面DOM解析完成后执行,而onload事件是在所有资源都准备完成之后才执行,也就是说$(document).ready()是要在onload之前执行的,尤其当页面图片较大较多的时候,这个时间

  • javascript两种function的定义介绍及区别说明

    一般情况下两者的调用结果是一样的,但是还是有区别的. 第一种方式: 复制代码 代码如下: function a(){ alert('old'); } var b=a; function a(){ b(); alert('new'); } a();//浏览器就会出现内存溢出的情况 第二种方式: 复制代码 代码如下: function a(){ alert('old'); } var b=a; var a=function(){ b(); alert('new'); } a();//浏览器就会按顺序

随机推荐