ajax

作用

能够向服务器请求额外的数据而无须卸载页面(即刷新)，能够实现异步请求。

实现步骤

1、创建核心对象 XMLHttpRequest
　　var xhr = new XMLHttpRequest();
2、打开请求 open()
　　xhr.open(参数1,参数2,参数3);
　　参数1：请求类型（GET/POST）
　　参数2：请求的地址
　　参数3：是否异步 true表示异步，false表示同步
如果为post请求，需要在后面再添加一句：
　　xhr.setRequestHeader(‘Content-Type’,‘application/x-www-form-urlencoded’)
3、发送请求 send()
　　xhr.send(参数);
　　参数：
　　如果是GET请求，参数直接设置在请求的路径之后，所以设置为null
　　如果是POST请求，有参数则设置参数，无参数则设置为null
当请求发送到服务器端，收到响应后，响应的数据会自动填充 XHR 对象的属性。
属性名 　　　　　　　　说明
responseText 　　　　作为响应主体被返回的文本
responseXML　　　　如果响应主体内容类型是"text/xml"或"application/xml"，则返回包含响应数据的 XML DOM 文档
status 　　　　　　　响应的 HTTP 状态
statusText 　　　　　HTTP 状态的说明
4、解析响应
　　xhr.responseText 响应的结果
同步：需要判断status属性是否为200，响应成功才解析响应。
异步：首先需要添加readystatechange 事件，判断readyState是否为4，完全响应，在执行和同步一样的步骤。

status属性

status：HTTP 状态代码。
HTTP状态码 　　状态字符串　　　　　 说明
200　　　　　　　　OK 　　　　服务器成功返回了页面
400 　　　　　Bad Request 　　　语法错误导致服务器不识别
401 　　　　　Unauthorized 　　请求需要用户认证
404 　　　　　Not found 　　　　指定的 URL 在服务器上找不到
500 　　　　Internal Server Error 　　服务器遇到意外错误，无法完成请求
503 　　　　ServiceUnavailable 　服务器过载或维护导致无法完成请求

readyState 属性

使用使用异步调用的时候，检测 readyState 属性，每当 readyState 属性改变时，触发readystatechange 事件。
值 　　　　状态 　　　　　　　说明
0 　　　未初始化 　　　尚未调用 open()方法
1 　　　　启动　　　　已经调用 open()方法，但尚未调用 send()方法
2　　　　 发送 　　　　已经调用 send()方法，但尚未接受响应
3 　　　　接受 　　　　已经接受到部分响应数据
4 　　　　完成 　　　　已经接受到全部响应数据，而且可以使用