关于AJAX中函数的执行顺序
考察w3school上的一个实际的例子[1]:
<html>
<head>
<script type="text/javascript">
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
} xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
} xmlhttp.open("GET","/ajax/test1.txt",true);
xmlhttp.send(); }
</script>
</head>
<body> <div id="myDiv"><h2>Let AJAX change this text</h2></div>
<button type="button" onclick="loadXMLDoc()">通过 AJAX 改变内容</button> </body>
</html>
关注下标红部分的代码的顺序,如果把代码改成如下的顺序:
<html>
<head>
<script type="text/javascript">
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
} xmlhttp.open("GET","/ajax/test1.txt",true);
xmlhttp.send(); xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
} }
</script>
</head>
<body> <div id="myDiv"><h2>Let AJAX change this text</h2></div>
<button type="button" onclick="loadXMLDoc()">通过 AJAX 改变内容</button> </body>
</html>
<html>
<head>
<script type="text/javascript">
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
} xmlhttp.open("GET","/ajax/test1.txt",true); xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
} xmlhttp.send(); }
</script>
</head>
<body> <div id="myDiv"><h2>Let AJAX change this text</h2></div>
<button type="button" onclick="loadXMLDoc()">通过 AJAX 改变内容</button> </body>
</html>
实测证明:三种代码顺序的执行结果是一样的。这是由于以下的xhlhttp.onreadystatechange=function
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
仅仅是一个函数的声明(或者说 注册)【在JS里面,是允许函数嵌套声明的】,仅仅是把xhlhttp的onreadystatechange “属性”(实际是个函数)声明出来,并不立即执行。而
xmlhttp.open("GET","/ajax/test1.txt",true);
xmlhttp.send();
是会立即执行的。如果想要xhlhttp.onreadystatechange=function立即执行,只需要将该模块声明为 “立即执行”。
( xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}) ();
Reference
[1]http://www.w3school.com.cn/tiy/t.asp?f=ajax_async_true
关于AJAX中函数的执行顺序的更多相关文章
- jquery ajax 中各个事件执行顺序
jquery ajax 中各个事件执行顺序如下: 1.ajaxStart(全局事件) 2.beforeSend 3.ajaxSend(全局事件) 4.success 5.ajaxSuccess(全局事 ...
- jquery ajax中各个事件执行顺序如下
$(function(){ setTimeout(function(){ $.ajax({ url:'/php/selectStudent.php', }); },0); $(document).aj ...
- jquery ajax中事件的执行顺序
jquery中各个事件执行顺序如下: 1.ajaxStart(全局事件) 2.beforeSend 3.ajaxSend(全局事件) 4.success 5.ajaxSuccess(全局事件) 6.e ...
- Unity3D中默认函数的执行顺序
直接用一张图来说明各个默认函数的执行顺序: FixedUpdate以固定的物理时间间隔被调用,不受游戏帧率影响.一个游戏帧可能会调用多次FixedUpdate.比如处理Rigidbody的时候最好用F ...
- Tip8:Unity中诸如 Awake() Start() Update()等函数的 执行顺序
Unity脚本中有很多的事件函数,下面是各种函数的执行顺序: 1.reset(); 2.Awake(); 3.OnEnable; 4.OnLevelWasLoaded(); 5.Start(); 6. ...
- Unity3D中脚本的执行顺序和编译顺序
http://www.cnblogs.com/champ/p/execorder.html 在Unity中可以同时创建很多脚本,并且可以分别绑定到不同的游戏对象上,它们各自都在自己的生命周期中运行.与 ...
- unity3D技术之事件函数的执行顺序[转]
unity3D技术之事件函数的执行顺序 转自http://www.yxkfw.com/?p=13703 在unity的脚本,有大量的脚本执行按照预先确定的顺序执行的事件函数.此执行顺序说明如下: ...
- 【转】Unity3D中脚本的执行顺序和编译顺序(vs工程引用关系)
http://www.cnblogs.com/champ/p/execorder.html 在Unity中可以同时创建很多脚本,并且可以分别绑定到不同的游戏对象上,它们各自都在自己的生命周期中运行.与 ...
- mysql 中sql的执行顺序
文章转自 https://www.cnblogs.com/annsshadow/p/5037667.html https://www.cnblogs.com/yyjie/p/7788428.html ...
随机推荐
- php网址显示excel表格内容
/** * excel表格内容在网页中显示 * * 首先需要下载PHPExcel 工具包 * 网址: http://phpexcel.codeplex.com/releases/view/119187 ...
- ubuntu下安装numpy和matplotlib
安装NumPy函数库--sudo apt-get install python-numpy 以及 sudo apt-get install python-scipy NumPy函数库的函数查看:Nu ...
- Spring系列之谈谈对Spring IOC的理解
学习过Spring框架的人一定都会听过Spring的IoC(控制反转) .DI(依赖注入)这两个概念,对于初学Spring的人来说,总觉得IOC .DI这两个概念是模糊不清的,是很难理解的,今天和大家 ...
- 浅谈Android下的Bitmap之大Bitmap加载
引言 我们常常提到的“Android程序优化”,通常指的是性能和内存的优化,即:更快的响应速度,更低的内存占用.Android程序的性能和内存问题,大部分都和图片紧密相关,而图片的加载在很多情况下很用 ...
- ios几个重要方法
加载类到内存,程序刚启动的时候调用,调用在main函数之前 1.+(void)load{ } 初始化类,类第一次使用的时候调用一次 2.+(void)initialize{ } 控制器的视图架构,设 ...
- tyvj1148 小船弯弯
描述 童年的我们,充满了新奇的想法.这天,小朋友们用彩虹画笔在云霞上绘制了世界上最美丽的图画.那描绘的是一条大河波浪宽,风吹稻花香两岸的情景.欣赏着自己的作品,小朋友们别提多开心了.这时,Q小朋友对C ...
- 清北学堂模拟赛day7 石子合并加强版
/* 注意到合并三堆需要枚举两个端点,其实可以开一个数组记录合并两堆的结果,标程好像用了一个神奇的优化 */ #include<iostream> #include<cstdio&g ...
- Servlet session
一.session介绍 Session用于保存服务端与客户端"会话"的信息.例如你逛淘宝时添加到购物车中的商品的信息就是保存到Session中.与Cookies不同的是,S ...
- .htaccess 基础教程(一)
.htaccess是什么? .htaccess叫分布式配置文件,它提供了针对目录改变配置的方法——在一个特定的文档目录中放置一个包含一个或多个指令的文件, 以作用于此目录及其所有子目录.并且子目录中的 ...
- python操作mysql总结
Windows系统,python环境搭建. 下载并安装python2.7.11 https://www.python.org/downloads/ 下载并安装python的mysql包: http:/ ...