jquery中的$(document).ready()、JavaScript中的window.onload()以及body中的onload()的区别
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()的区别的更多相关文章
- jquery中的$(document).ready()使用小结
本篇文章主要是对jquery中的$(document).ready()使用方法进行了详细的总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助 window.onload = function(){ ...
- jquery中的$(document).ready()
window.onload = function(){ alert("welcome"); } 这样的写法作用是希望在页面加载完,自动执行定义js代码(function). $(d ...
- 使用 JavaScript 中的 document 对象的属性,根据下拉框中选择的属性,更改页面中的字体颜色和背景颜色
查看本章节 查看作业目录 需求说明: 使用 JavaScript 中的 document 对象的属性,根据下拉框中选择的属性,更改页面中的字体颜色和背景颜色 实现思路: 在页面的 <body&g ...
- jquery的$(document).ready()与js的window.onload区别
<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> ...
- jquery学习之$(document).ready()
参考资料: 1.W3School在线教程:http://www.w3school.com.cn/jquery/event_ready.asp 2.某人博客园:http://www.cnblogs.co ...
- jquery中的$(document).ready()、JavaScript中的window.onload()以及body中的onload()、DomContentLoaded()区别
$().ready().$(handler).$(document).ready(handler)均不是原生JS中的,都是jQuery中封装的方法.这些事件在当页面的dom节点加载完毕后就执行,无需等 ...
- jQUery中的$(document).ready()方法和window.onload()方法的区别
1.常规的Javascript代码中,通常使用window.onload方法 window.onload = function(){//代码} 2.jquery中,则使用$(document).rea ...
- jquery mobile在页面加载时添加加载中效果 document.ready 和window.onload执行顺序比较
想要添加这个效果,先来弄明白页面的加载和事件执行顺序,看这个简单例子: <html xmlns="http://www.w3.org/1999/xhtml"> < ...
- jquery中的$(document).ready(function(){})和$(window).load()比较
1.执行时间 window.onload()即jquery写法中的$(window).load(function(){})必须等到页面内包括图片的所有元素加载完毕后才能执行. $(document). ...
随机推荐
- 设置某个ip对mysql服务器有权限,以及mysql定时备份
CREATE USER 'new_username'@'211.68.%.%' IDENTIFIED BY 'password_for_new_username'; GRANT ALL ON * TO ...
- iOS学习01C语言数据类型
1.注释 // 单行注释 // 注释对代码起到解释说明的作用,注释是给程序员看的,不参与程序运行 /* 多行注释 Xcode快捷键 全选 cmd+a 复制 cmd+c 粘贴 cmd+v 设 ...
- 【CQgame】[下一百层] [Down]
简单的下一百层的c++实现,代码一晚上就码完了 注意:游戏前请在 默认值 或 属性 中调整缓冲区大小,否则会输出爆屏,方法写在代码里了 觉得速度 快/慢 的可以在第 23 行手动改一下,相信大神们能看 ...
- Codeforces Round #242 (Div. 2) C. Magic Formulas
解题思路是: Q=q1^q2.......^qn = p1^p2......^pn^((1%1)^....(1%n))^((2%1)^......(2%n))^.... 故Q的求解过程分成两部分 第一 ...
- 给@dudu 一个idea
好长时间没写文章了,因为我最近一直在琢磨博客园如何才能成为一家上市公司,上市前我在博客园买点原始股,说不定就发了. 现在遇到错误总是先谷歌,谷歌背墙,在百度,百度不到在到博客园找 找看看 因为找找 ...
- BZOJ4521: [Cqoi2016]手机号码
Description 人们选择手机号码时都希望号码好记.吉利.比如号码中含有几位相邻的相同数字.不含谐音不 吉利的数字等.手机运营商在发行新号码时也会考虑这些因素,从号段中选取含有某些特征的号 码单 ...
- LightOJ 1012 简单bfs,水
1.LightOJ 1012 Guilty Prince 简单bfs 2.总结:水 题意:迷宫,求有多少位置可去 #include<iostream> #include<cstr ...
- 深入浅出 - Android系统移植与平台开发(十) - led HAL简单设计案例分析
作者:唐老师,华清远见嵌入式学院讲师. 通过前两节HAL框架分析和JNI概述,我们对Android提供的Stub HAL有了比较详细的了解了,下面我们来看下led的实例,写驱动点亮led灯,就如同写程 ...
- Linux_解决nohup命令生成的多余的大日志文件
解决nohup命令生成的多余的大日志文件 经常使用命令 nohup /usr/bin/php /srv/www/update.php & 可以让它在后台安静的进行,但是有一个烦恼就是,它会生成 ...
- About_PHP
所谓PHP: 超文本预处理器 外文名称 Hypertext Preprocessor 编程范型 面向对象.命令式编程 php就是比js更高端的一种语言. 语法有两种: <?php ?& ...