body中的onload()和window.onload以及$(document).ready()的区别：

1、前两者都表示当页面加载元素（包括图片等信息）完毕后执行的操作，而且两者在各种浏览器中都兼容，而$(document).ready()表示的是JQuery中的一个方法因而只有在支持jQuery的浏览器中才适用，同时该方法是在当页面的dom节点加载完毕后就执行，无需等待页面中的图片等加载完成。

2、当代码中同时存在body中的onload()和window.onload()要注意的 ：

a、当JS代码在head中时且window.onload()中方法是匿名时：将会跳过window中的方法。

<html>

<head>

<script type="text/javascript"> alert('a');

window.onload=function () {

alert('b');

} ;

alert('c');

</script>

</head>

<body onload="alert('d');">

</body>

</html>

上面的代码中执行的结果是：a,c,d

b、当JS代码在head中同时window.onload()中方法不是匿名时，这时会对浏览器的不同有差异，在IE8以及IE8以下的版本中会顺序执行JS代码到window.onload()但其后面的将不会被执行（除了定义的方法在其他地方被调用的外），而在IE8以上以及chrome等浏览器中都将会被执行。

<html>

<head>

<script type="text/javascript"> alert('a');

window.onload=fn();

function fn() {

alert('b');

} ;

alert('c');

</script>

</head>

<body onload="alert('d');">

</body>

</html>

由上知当在IE8以及以下的版本中的执行结果为：abd，在其他浏览器中的执行结果为:

a,b,c,d

c、当JS代码在body中时同时window.onload()中的方法不是匿名的时：

<html>

<head>

</head>

<body onload="alert('a');">

<script type="text/javascript"> alert('b');

window.onload=fn();

function fn () {

alert('c');

} ;

alert('d');

</script>

</body>

</html>

上述代码在IE8以及以下版本中的执行结果为：b,c,a在其他浏览器中的执行结果为:b,c,d

d、当JS代码中body中同时window,onload()中的方法是匿名函数时：

<html>

<head>

</head>

<body onload="alert('a');">

<script type="text/javascript"> alert('b');

window.onload=function  () {

alert('c');

} ;

alert('d');

</script>

</body>

</html>

上述代码的执行结果为：b,c,d

将JS代码放在body和放在head中的结果不一样这是和文档的加载顺序相关的。

jquery中的$(document).ready()、JavaScript中的window.onload()以及body中的onload()的区别的更多相关文章

  1. jquery中的$(document).ready()使用小结

    本篇文章主要是对jquery中的$(document).ready()使用方法进行了详细的总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助 window.onload = function(){ ...

  2. jquery中的$(document).ready()

    window.onload = function(){ alert("welcome"); } 这样的写法作用是希望在页面加载完,自动执行定义js代码(function). $(d ...

  3. 使用 JavaScript 中的 document 对象的属性，根据下拉框中选择的属性，更改页面中的字体颜色和背景颜色

    查看本章节 查看作业目录 需求说明: 使用 JavaScript 中的 document 对象的属性,根据下拉框中选择的属性,更改页面中的字体颜色和背景颜色 实现思路: 在页面的 <body&g ...

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

    <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> ...

  5. jquery学习之$(document).ready()

    参考资料: 1.W3School在线教程:http://www.w3school.com.cn/jquery/event_ready.asp 2.某人博客园:http://www.cnblogs.co ...

  6. jquery中的$(document).ready()、JavaScript中的window.onload()以及body中的onload()、DomContentLoaded()区别

    $().ready().$(handler).$(document).ready(handler)均不是原生JS中的,都是jQuery中封装的方法.这些事件在当页面的dom节点加载完毕后就执行,无需等 ...

  7. jQUery中的$(document).ready()方法和window.onload()方法的区别

    1.常规的Javascript代码中,通常使用window.onload方法 window.onload = function(){//代码} 2.jquery中,则使用$(document).rea ...

  8. jquery mobile在页面加载时添加加载中效果 document.ready 和window.onload执行顺序比较

    想要添加这个效果,先来弄明白页面的加载和事件执行顺序,看这个简单例子: <html xmlns="http://www.w3.org/1999/xhtml"> < ...

  9. jquery中的$(document).ready(function(){})和$(window).load()比较

    1.执行时间 window.onload()即jquery写法中的$(window).load(function(){})必须等到页面内包括图片的所有元素加载完毕后才能执行. $(document). ...

随机推荐

  1. java-嵌套类

    浏览以下内容前,请点击并阅读 声明 java允许在一个类中定义另外一个类,这就叫类嵌套.类嵌套分为两种,静态的称为静态嵌套类,非静态的又称为内部类. 使用嵌套类的原因: 能够将仅在一个地方使用的类合理 ...

  2. Android系统中的6种模式

    Android系统中的6种模式 1:一般启动模式(normal mode):    功能是正常启动手机,方法为关机状态下按电源键启动. 2:安全模式(safe mode):    此模式和正常启动一样 ...

  3. BZOJ3068 : 小白树

    枚举每条树边,将其断开,那么两侧肯定取带权重心最优. 考虑如何求出每个子树的重心,枚举其所有儿子,通过重量关系就可以判断出重心位于哪棵子树. 然后将那棵子树的重心暴力往上爬即可,因为每个点作为重心肯定 ...

  4. CentOS6.4 安装OpenResty和Redis 并在Nginx中利用lua简单读取Redis数据

    1.下载OpenResty和Redis OpenResty下载地址:wget http://openresty.org/download/ngx_openresty-1.4.3.6.tar.gz Re ...

  5. [Codeforces] Round #320 (Div.2)

    1.前言 虽然这次我依旧没有参加正式比赛,但是事后还是看了看题目的...一般不怎么刷Codeforces. A.Raising Bacteria You are a lover of bacteria ...

  6. BZOJ4127: Abs

    Description 给定一棵树,设计数据结构支持以下操作 1 u v d 表示将路径 (u,v) 加d 2 u v 表示询问路径 (u,v) 上点权绝对值的和 Input 第一行两个整数n和m,表 ...

  7. 广播变量、累加器、collect

    广播变量.累加器.collect spark集群由两类集群构成:一个驱动程序,多个执行程序. 1.广播变量 broadcast 广播变量为只读变量,它由运行sparkContext的驱动程序创建后发送 ...

  8. [LintCode] Pow(x, n) 求x的n次方

    Implement pow(x, n). Notice You don't need to care about the precision of your answer, it's acceptab ...

  9. Digital Imaging Processing 数字图像处理

    8-Bit and 16-Bit Images 关于量化压缩与量化补偿 RGB Bayer Color分析 彩色CCD/CMOS的格式和计算机中的读取格式

  10. Java 多继承

    浅浅地上了几天 Java 的课程,然后怎么也想不明白:Java 不支持多继承有和接口到底是什么样的关系? 一只牛的故事. // 叫的抽象基类 abstract class call{ } // 跑的抽 ...