原生Ajax请求实现步骤

一、Ajax简介

  Ajax是Asynchronous JavaScript and XML的缩写，异步的JavaScript和XML。它可以实现客户端的异步请求操作，在不重新加载页面的情况下与服务器进行通信，实现部分页面的更新，从而减少用户等待时间。

二、核心对象XMLHTTPRequest

• 异步与同步
  异步即一次可以执行多个请求，而同步一次只能执行一个请求。异步与同步最本质的区别是同步需要等待，异步不需要。

• readystatues属性（0,1,2,3,4）
  0: 请求未初始化
  1: 服务器连接已建立
  2: 请求已接收
  3: 请求处理中
  4: 请求完成

• statues属性（200,404）
  网络通信的状态。200：通信成功，请求成功。404：资源没找到。

• 异步请求实现步骤

1. 创建XMLHTTPRequest

var xmlHttp = new XMLHTTPRequest();

2. 绑定事件

xmlHttp.onreadystatechange(function(){
   
	//获取服务器端返回的数据，更新dom
	if (xmlHttp.readyState == 4 && xmlHttp.status == 200){
   
    	var data = xmlHttp.responseText;	//responseText为服务器返回的数据
        //alert(data);
        document.getElementById("id").innerText = data;
    }
})

3. 初始化请求参数

xmlHttp.open(method,url,async);
	//参数method为请求方式，取值为post/get
	//参数url为请求地址
	//参数async设定是否为异步请求，async默认为true

4. 发送请求

xmlHttp.send();		//发送请求