jquery中的$(document).ready()、JavaScript中的window.onload()以及body中的onload()、DomContentLoaded()区别
$().ready()、$(handler)、$(document).ready(handler)均不是原生JS中的,都是jQuery中封装的方法。这些事件在当页面的dom节点加载完毕后就执行,无需等待页面中的图片等加载完成。DomContentLoaded是原生的表示在Dom节点加载完毕之后就执行该事件。
window.onload()以及body中的onload()两者都表示当页面加载元素(包括图片等信息)完毕后执行的操作,是原始JS中就有的。同时window.onload只能注册一个事件处理函数,和原生JS通过属性注册事件的原理(详情见博客)是一样的,后面注册的会覆盖前面的 ,在IE10和火狐中window.onload和body.onload是一样的,所以在后面的会覆盖前面的,但是在chrome中则两者不一样注册的事件均会被执行。
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>
上面的代码在IE10以及火狐中执行的结果是:a,c,d,在谷歌中的结果为:a、c,b,d
b、当JS代码在body中:
<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>
谷歌火狐等的执行结果为:b,d,c
注意在给window.onload赋值的时候是赋值的方法名或者匿名函数而不是方法,否则直接执行函数,结果不是预期的效果
jquery中的$(document).ready()、JavaScript中的window.onload()以及body中的onload()、DomContentLoaded()区别的更多相关文章
- 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()的区别
body中的onload()和window.onload以及$(document).ready()的区别: 1.前两者都表示当页面加载元素(包括图片等信息)完毕后执行的操作,而且两者在各种浏览器中 ...
- 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). ...
随机推荐
- Tesseract-OCR 自动生成识别库的批处理
用Tesseract-OCR做识别库的时候,生成字典非常麻烦,就写了一个批处理,用来生成字典还是蛮方便的,希望大家有用,该批处理已经自动生成font_properties文件,各位无需手动创建 下载地 ...
- HDU1398 Square Coins(生成函数)
Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Submission( ...
- 消息队列MSMQ的使用
1.MSMQ安装 控制面板-程序和功能-打开或关闭Windows功能-Microsoft Message Queue(MSMQ)服务器,选中所有,点击确定. 2.消息队列的应用场景(转载自http:/ ...
- JQuery制作网页——第九章 表单验证
1. 表单验证:减轻服务器的压力.保证输入的数据符合要求: 2. 常用的表单验证:日期格式.表单元素是否为空.用户名和密码.E-mail地址.身份证号码等: 3. 表单验证的思路: 1. ...
- Google+百度,自动识别知名人物的性别
最近有一个任务,需要采集一批知名学者的性别信息.该任务的难点在于提供学者信息的网站并不会主动标注学者的性别性别,因此只能靠别的方法了. 对一个普通人来说,在网上判断一个人的性别的最快的方式就是看他的照 ...
- nginx ssl pathinfo 伪静态 301 配置文件
server { listen ; root /www/web/test_com/public_html; server_name test.com test.com; if ($host != '* ...
- Mysql慢查询开启和查看 ,存储过程批量插入1000万条记录进行慢查询测试
首先登陆进入Mysql命令行 执行sql show variables like 'slow_query%'; 结果为OFF 说明还未开启慢查询 执行sql show varia ...
- PHP交友网站源码、门户社交聊天网站源码,多国语言婚恋交友网站
交友网站管理系统,是一款基于微软ASP平台开发,集成交友.婚介.商家.并与支付宝.财付通.完美整合等功能于一体的交友网站管理系统.地方交友网站,企业或个人都有能力运营地方交友门户网站,完善的会员系统. ...
- [转]MySQL日期与时间戳常用函数
本文原文地址:https://www.cnblogs.com/jhy-ocean/p/5560857.html 平时比较常用的时间.字符串.时间戳之间的互相转换,虽然常用但是几乎每次使用时候都喜欢去搜 ...
- win10每次重新启动,eclipse不能打开,要重新配jdk环境的解决办法
在后面加上反斜杠就好,也不知道是什么原因,知道的同学希望可以在下面的评论告诉我.