ajax原生

1.同步/异步

2.XHR对象

var request = new XMLHttpRequest();

//兼容不同浏览器伪代码

if(window.xhr)

{

request= new XMLHttpRequest();

}else{

request= new ActivexObject（Microsoft.XMLHttp）;//IE5,IE6

}

3.http请求

tcp连接步骤：牵手

1. 浏览器->web服务器发送请求命令
2. 浏览器->web服务器头信息
3. web服务器应答->浏览器
4. web服务器应答头信息->浏览器
5. web服务器发送数据->浏览器
6. web服务器关闭连接

请求4要素

1. 方法get/post
2. url
3. 客户端环境信息，身份
4. 请求正文  

 GET：用于信息获取，url传值，2000字符内，安全，查询，显示在url

 POST：修改服务器资源，信息数量无限制

http请求包含：状态码（文字或数字），响应头，响应体

状态码一般由三位数字构成

4.XHR对象的方法（http代码实现步骤）

1. open（method，url，async）
2. setRequestHeaeder（“Content-Type”，“？？”）//设置头信息 ，post方法需要
3. send（arg0）//post方法才要参数

5.取得响应

• responeseText：字符串形式响应
• responeseXML：获得XML形式响应
• status/statusText：获得状态码
• getAllResponseHeader():获取所有响应报头
• getResponseHeader(？)：某响应报头

6.监听readyState属性来确认是否牵手成功:

属性值有：

• 0：请求未初始化，open还没调用；（0-1这个过程有些浏览器不会被触发）
• 1服务器连接已建立，open已经调用了；
• 2请求已接受，也就是收到头信息了；
• 3请求处理中，也就是接收到响应主体了；
• 4请求已完成，且响应已就绪，也就是响应完成了

注意：

• get请求中，通过把表单中的值放在open方法的第二个参数url后面，通过加？隔开

比如request.open("GET","serversent.php?number="+document.getElementById("keyword").value);

• post方法中，设置变量data，通过send(data)来发送数据。data格式：属性+值&属性+值&属性+值
• post方法需要用setRequestHeaeder（“Content-Type”，“？？”）//来设置头信息

此方法必须在open（）和send（）之间使用

eg：表单的是：request.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

7.通过写onreadystatechange属性来

request.onreadystatechange=function (){

if(request.readysate===4){

if(request.readystatus===200)

{do something;

return;}

}else{出现错误；}

}

小技巧：查看f12

点击文件，查看状态

引入json

• 解析json字符串：eval（），JSON.parse(）

1. 1. 1. 1. 1. 1. 1. eval（）不仅解析json，还执行json中的方法，危险，慎用
                  2. JSON.parse() 如果json对象中有函数，会报错

• 校验工具：jsonlint.com
• json格式

'{"success"键值可以作为请求成不成功

“errormsg”可以作为请求失败返回的错误信息

“data”可以作为请求返回的数据

}'