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). ...
随机推荐
- sql 复杂查询 以teacher student course多对多关系为例
数据库表和值 /* SQLyog Ultimate v8.32 MySQL - 5.7.17-log : Database - course_dbms ************************ ...
- 关于js代码位置的第一次总结
最近在学习dom树节点操作时,发现查找结点总是返回null,原因在于将js代码放在了head里,因为页面是从上往下逐行加载,在还未加载相关节点时当然查找不到,返回值为null. 而对于另一句老生常谈的 ...
- 爬虫-scrapy五大核心组件及工作流
- C语言自问自答
Windows系统下,最好如何配置环境? notepad++,tdm-gcc,powershell来进行! scanf函数的返回值,和不符合格式如何返回? #include<stdio.h> ...
- C语言中结构体的访问方法解读
在C语言中,对结构体的访问一般有两种常规方式:"."访问和"->"访问.那么两者有什么区别呢?对C语言有一定了解的同学应该知道,我们新建一个结构体的时候, ...
- 位域 (Bit field)
最近开始看编程之美这本书,里面有一道关于中国象棋将帅位置的简单问题,如下图所示,写一个程序输出将.帅的合法位置. 分析与解法 问题的本身并不复杂,只要把所有A.B 互相排斥的条件列举出来就可以完成本题 ...
- HyperLedger Fabric 1.4 单机单节点部署(10.2)
单机单节点指在一台电脑上部署一个排序(Orderer)服务.一个组织(Org1),一个节点(Peer,属于Org1),然后运行官方案例中的example02智能合约例子,实现转财交易和查询功能.单机单 ...
- [POJ3090]Visible Lattice Points(欧拉函数)
答案为3+2*∑φ(i),(i=2 to n) Code #include <cstdio> int T,n,A[1010]; void Init(){ for(int i=2;i< ...
- Java设计模式(17)——行为模式之观察者模式(Observer)
一.概述 概念 UML简图 我们根据一个示例得类图来分析角色 角色 抽象主题:保存观察者聚集(集合),管理(增删)观察者 抽象观察者:定义具体观察者的抽象接口,在得到主题通知后更新自己 具体主题:将有 ...
- URL传值中文乱码的解决
使用 tomcat 时,相信大家都回遇到中文乱码的问题,具体表现为通过表单取得的中文数据为乱码. 一.初级解决方法 通过一番检索后,许多人采用了如下办法,首先对取得字符串按照 iso8859-1 进行 ...