使用ajax从服务器端获取数据

最新推荐文章于 2025-07-14 20:11:55 发布

原创最新推荐文章于 2025-07-14 20:11:55 发布 · 5k 阅读

5 ·

CC 4.0 BY-SA版权

本文详细介绍了如何使用Ajax从服务器端获取数据的步骤，包括创建XMLHttpRequest对象，open方法的参数设置，异步请求的处理，以及回调函数中readyState和status的判断，最后演示了发送请求和传递参数的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

使用ajax从服务器端获取数据的步骤：

代码表示：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			var xhr = new XMLHttpRequest();
			xhr.open("GET","ajax.do",true);
			xhr.onreadystatechange= function(){
				if(xhr.readyState==4&&xhr.status==200){
					var msg = document.getElementById("con");
					msg.innerHTML=xhr.responseText;
				}
			};
			xhr.send();
			
		</script>
	</head>
	<body>
		<div id="con">
			
		</div>
	</body>
</html>

Ajax的使用包括四步：

1.创建XMLHttpRequest对象，注意兼容IE6的情况

2.使用XMLHttpRequest对象的open方法，其中有三个参数：2.1.字符串，代表html的请求:GET,POST。

2.2.要访问的服务器的 URL。

2.3.Boolean值，true表示异步，flase表示同步，一般情况下是异步，默认为true。

3.ajax的回调函数。* xhr.readyState==4表示请求已经结束，服务器响应完成。

* status表示http请求的状态，200表示正常响应；404表示资源找不到；500表示服务器端错误。

4.发送ajax请求。* 如果没有数据，可以不传或者传递null

* 如果post请求传递数据：首先设置xhr的请求头信息：xhr.setRequestHeader("Content-type","application/x-www-formurlencoded");

再传递参数：xhr.send(name=liujianhong&password=123);