视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
Ajax实现同步和异步请求
2020-11-27 19:33:30 责编:小采
文档
 ajax有同步请求和异步请求,同步请求是指同一个时间点只允许执行一个进程,异步请求是指同一个时间点可以执行多个进程。

ajax对象.open(方式get/post,url地址,[异步true]同步false);

ajax是可以与服务器进行(异步或同步)交互的技术之一。

异步:同一个时间点允许执行多个进程。

同步:同一个时间点只允许执行一个进程。

服务器端04.php:

<?php

echo "computer";

同步请求:

客户端04async.html:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>ajax同步</title>
	<script type="text/javascript">
	alert(1234);
	</script>
</head>
<body>
	<img src="./1.png" alt="" width="400" height="300">
</body>
</html>

实现效果:


异步请求:

客户端05async.html:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>ajax同步</title>
	<script type="text/javascript">
	var xhr = new XMLHttpRequest();
	xhr.onreadystatechange = function(){
	if (xhr.readyState==4) {
	alert(xhr.responseText);
	}
	}
	xhr.open('get', './04.php', true);//异步请求
	//xhr.open('get', './04.php', false);//同步请求
	xhr.send(null);
	</script>
</head>
<body>
	<img src="./1.png" alt="" width="400" height="300">
</body>
</html>

实现效果:



异步请求只是给用户视觉上的同时呈现,但是若ajax请求响应或img响应时间不一致也会出现先后顺序,只是同一时间点多个进程同时执行。

什么时候使用同步请求?

ajax绝大多数情况下进行异步请求,但是有的时候也要使用“同步请求”(其不能取代)。

例如页面有两部分内容,ajax请求内容和正常的html内容输出,如果html的输出内容包括ajax请求的内容,就需要使用ajax请求完成了再进行html内容的输出,这样就要设置两者一前一后调用(而非同时调用),既要进行同步请求。

下载本文
显示全文
专题