【前言】
Ajax作为现行的实现网页异步交互的主要技术，是前端知识体系中重要的一环，本文介绍了使用Ajax的基本内容。
【基本内容】
【同步交互和异步交互】
【同步交互】
- 客户端向服务器端发送请求，到服务器端进行相应，整个过程中用户不能进行其他操作。
【异步交互】
- 客户端向服务器端发送请求，直到服务器端进行响应，用户能够进行其他操作
【Ajax】
- Asynchronous JavaScript and Xml
- Ajax实现B/S架构下的异步交互
【同步和异步的区别】
同步：执行速度慢，响应的是完整的HTML页面
异步：执行速度相对比较快，响应的是部分数据
【Ajax的核心对象】
- XMLHttpRequest对象
【创建XMLHttpRequest对象】
function getXhr(){ ???var xhr = null; ???if(window.XMLHttpRequest){ ???????xhr = new XMLHttpRequest(); ???}else{ ???????xhr = new ActiveXObject(‘Microsoft.XMLhttp‘); ???}
return xhr;} ???【XMLHttpRequest对象的属性和方法】
【属性】
- readyState：当前请求状态
* 0：尚未初始化
* 1：正在发送请求
* 2：请求发送完成
* 3：请求成功，正在响应
* 4：响应完毕
- status：服务器返回的HTTP请求响应值
* 200 请求成功
* 202 请求被接受但是处理未完成
* 400 错误的请求
* 404 资源未找到
* 500 内部服务器错误，如asp代码错误等
【方法】
- open(method,url,async)
* method：设置当前请求的类型
* url：设置当前请求的地址
* async：设置是否异步（不建议使用）
- send(请求参数)
* 请求参数的格式：key=value;
【事件】
- onreadystatechange事件
【实现Ajax异步交互的步骤】
【1】创建XMLHttpRequest对象
【2】与服务器建立连接
- 使用XMLHttpRequest对象的open(method,url)方法
【3】向服务发送请求
- 使用XMLHttpRequest对象的send(请求参数)方法
【4】接收服务器端的响应数据
- 使用XMLHttpRequest对象的onreadystatechange事件，监听服务器端的通信状态
- 使用XMLHttpRequest对象的readyState属性，判断服务器端的当前状态
- 使用XMLHttpRequest对象的status属性，判断服务器端的状态码
- 使用XMLHttpRequest对象的responseText属性，接收服务器端的响应数据
【GET和POST方式的区别】
【GET请求类型】
- send()方法不起作用，但是不能被省略
xhr.send(null);
- 请求参数添加到url?key=value
【POST请求方式】
- send()方法起作用
在sen()方法被调用之前，使用setRequestHeader()方法设置请求头信息
xhr.setRequestHeader("Conten-Type","application/x-www-form-urlencoded");
Ajax
原文地址：http://www.cnblogs.com/controlms/p/7835148.html