Jquery的ready和Dom的onload的区别

原创 2013年12月04日 10:17:19

在开发中遇到问题,需要在页面加载前显示广告提示。也就是在dom还没有加载先显示广告,当页面所有资源加载完后在隐藏广告,显示dom内容。window onload包含dom load。

 

页面响应加载的顺序是,域名解析->加载html->加载js和css->加载图片等其他信息,jquery的Dom Ready方法在加载图片等其他信息前就可以操作Dom了,先于window.onload事件触发前执行。

 

Jquery的ready和Dom的onload的区别: 

   1. onload是所有dom元素创建完毕,图片、css等都加在加载完毕后才触发 

   2. ready则是dom元素创建完毕后就被触发 

相对来说jquery的ready可以提高网页的响应速度.

 

<html> 
<head> 
<TITLE>class_obj_js_class</TITLE>
<script type="text/javascript" src="jquery-1.4.4.js"></script>
<script language=javaScript> 

window.onload = function(){
	alert(1);
}

$(function(){
	alert("jquery ready function 1");
});

function init(){
	alert(2);
}


</script> 

<body onload="init()"> 
dafdfad
</body> 
</html>

<script language=javaScript> 
window.onload = function(){
	alert(3);
}

$(function(){
	alert("jquery ready function 2");
});
</script>
 

 

弹出的顺序是:

 

1、jquery ready function 1

2、jquery ready function 2

3、3

 

备注说明:

1、jquery的ready方法可以执行多次(按顺序执行)

2、window.onload不允许多次加载,若出现多次,则加载最后一个。

第一次加载window.onload方法,第二次加载<body onload>方法,最后加载html最后的onload方法

相关文章推荐

Jquery的ready和Dom的onload的区别及freemarker分页

今天改一bug,项目有一共通分页,需要改变当前页的颜色以示区别 发现用jquery 的ready()方法出现问题,有的页面没效果、看了半天代码感觉是因为出问题的那几个页面jquery导入的包在页面底部...

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

jQuery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法,不过与window.onload方法还是有区别的。 1.执行时间    ...

【jquery】一、 $(document).ready() 与window.onload的区别

Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法,不过与window.onload方法还是有区别的。 1.执行时间 win...

[JQuery]window.onload和$(document).ready的区别

很多同学(包括我)刚接触jQuery时,都搞不清传统的window.onload和jQuery的$(document).ready有什么区别。甚至有人认为这两者其实是一个东西,其实不然。查询资料,基本...

javascript知识点之onload和jquery方法ready()的区别

大多数情况下,jQuery代码的编写,都要求我们将jquery的代码放在 $(document).ready(function(){       ........jquery代码............
  • ymjring
  • ymjring
  • 2012年07月10日 15:53
  • 1966

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

$(document).ready()和window.onload在表单上看都是页面加载时我们就去执行一个函数或动作, 但是在具体的细节上$(document).ready()和window.onl...

js中onload和jQuery中ready的区别

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

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

Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法,不过与window.onload方法还是有区别的。 1.执行时间 ...

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

jQuery $(document).ready() Vs JavaScript window.onloadCreated by Yiyi_coding Last edited at 2015年7月...

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

1.执行时间 window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。 $(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕。 ...
  • dz45693
  • dz45693
  • 2011年11月23日 14:23
  • 2220
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Jquery的ready和Dom的onload的区别
举报原因:
原因补充:

(最多只允许输入30个字)