[TOC]
## 1.http请求
定义:http计算机通过网络进行通信的规则
![](https://box.kancloud.cn/4b3f4191f299bb5da204ba2068e06f13_633x403.png)
![](https://box.kancloud.cn/5270eec3ea4ba4f62af01112ea5b1da3_753x299.png)
![](https://box.kancloud.cn/744c00043585906db046b0f520d1b195_762x258.png)
![](https://box.kancloud.cn/28b71b4a5bdf8c5a1443818bf0116b15_741x242.png)
![](https://box.kancloud.cn/513735421f4d819d4dcf1561e3d5a10d_703x297.png)
## 2.请求响应
open(method,url,asyn)
asyn值默认为true
send()
onreadystatechange
## 3.一个完整的ajax的步骤
#### 1.创建ajax核心对象
#### 2.与服务器建立连接
#### 3.发送请求
#### 4.响应
### get请求
~~~
var url = "xxx";
var xhr = new XMLHttpRequest();
xhr.open('get',url,true);
xhr.send();
xhr.onreadystatechange = function(){
if(xhr.readyState == 4 && xhr.status == 200){
var txt = JSON.parse(xhr.responseText);
console.log(txt);
}
}
~~~
JSON.parse()方法将json对象解析为JavaScript对象。
JSON.stringify()将javascript的值,转换为JSON字符串。
* responseText:获取字符串形式的响应数据
* status:以数字形式返回http的状态码
* readystate值代表服务器响应的变化
### post请求
Post方式要设置一个请求头
~~~
<div id="test"></div>
<script>
var test = document.getElementById("test");
var xhr = new XMLHttpRequest();
xhr.open("post","xxx",true);
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xhr.send(null);
xhr.onreadystatechange = function(){
if(xhr.readyState == 4 && xhr.status == 200){
var data = JSON.parse(xhr.responseText);
test.innerHTML = data.data.content
}
}
</script>
~~~