AJAX JS 请求步骤

一,GET 请求

以下为异步方式

1,创建请求对象

//兼容 ie 5,6 写法
if(window.XMLHttpRequest) {
	var xhr = new XMLHttpRequest();
} else {
	var xhr = ActiveXObject("Microsoft.XMLHTTP");
}

2,监听 xhr 对象的请求状态,并对获取到的后天数据进行处理

readystate:xhr请求对象的 请求状态

* readystate的值(number类型)

        * 1:请求建立连接(没有执行 send())

        * 2:请求已发送,正在处理

        * 3:请求已经处理, 并且已经得到部分数据

        * 4:请求已经完成, 并且已经获取到所有数据

xhr.onreadystatechange = function(){
	if (xhr.readyState == 4) {
					
		//判断请求是否成功
		if (xhr.status >= 200 && xhr.status < 300 || xhr.status == 304) {
		//请求成功,json 数据解析 xhr.responseText 为后台传入的json字符串
              var arr = JSON.parse(xhr.responseText);
		}else{
			console.log("请求失败");
		}
	}
}

3,设置请求方式,启动请求 get 方式 将数据 以   key=value&key=value 形式在 url 后加?拼接在?之后

xhr.open("GET","AJAX.php?username=" + userN.value + "&userpass=" + userP.value);

4,发送请求

xhr.send(null);//null可省略

二,POST请求

第一,第二步与GET 方式一致

3,设置请求方式和网址  网址可写 绝对/相对  路径

 xhr.open("POST", "AJAX.php");

4,设置请求头  请求头内 书写方式 参考  :  AJAX请求头Content-type

xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded; charset=utf-8");

5,发起请求 send 方法 内参数  以 key = value&key = value形式书写

 xhr.send("username=" + userN.value + "&userpass=" + userP.value);

 

你可能感兴趣的:(JS,AJAX)