Ajax

最新推荐文章于 2024-06-20 09:53:57 发布

　Nayuta

最新推荐文章于 2024-06-20 09:53:57 发布

阅读量111

点赞数

本文链接：https://blog.csdn.net/HgBlnydy/article/details/94477749

版权

ajax

1.创建XMLHttpRequest核心对象
2.准备请求/打开请求
	xhr.open();open有参数
		1.请求类型(GET/POST)
		2.请求的路径(请求的地址,如果是GET请求后面通过"?"拼接参数)
		3.是否异步 (true或false,默认是异步)
3.发送请求
	xhr.send();  send有一个参数:
		1.要传递给后台的数据
			如果是GET请求,设置为null(GET请求参数在请求的地址后面)
			如果是POST请求,无参数时设置为null ,有参数时设置参数
4.判断相应结果 ,解析相应数据
	若是同步请求
		xhr.status 响应状态
			三种状态代表3中情况
			404 ,找不到,路径不正确
			500,服务器内部问题
			200,成功了
		xhr.response Text 响应结果
	若是异步请求,需要知道请求是否处理完毕,处理完毕后再解析数据
		监听处理,请求的状态码readyState,需要绑定监听事件 				        onreadystatechange ,判断响应状态码 为4时,代表数据已经完全响应了
			xhr.status 响应状态
				404 同上 ..
				500 同上...
				200 同上...
			xhr .responseText 响应结果
例:
<script type="text/javascript">
		
		// 创建XMLHttpRequest核心对象
		var xhr = new  XMLHttpRequest();
		console.log(xhr);
		
		
		// 2、准备请求/打开请求   open(请求类型,请求的路径,是否异步)
		xhr.open("GET","js/data.json",true); // 异步请求
		
		// 3、发送请求  xhr.send(参数);
		xhr.send(null);
		
		
		// 监听响应结果是否完全响应
		xhr.onreadystatechange = function(){
			console.log(xhr.readyState);
			//判断数据是否完全响应
			if ( xhr.readyState == 4) {
				// 4、判断响应结果，解析响应数据
				if (xhr.status == 200) {
					console.log(xhr.responseText);
				} else {
					alert("错误状态码：" + xhr.status + "，错误原因：" + xhr.statusText)
				}
			}
		}
		
		
		console.log("异步请求....");
		
	</script>
</html>