AJAX的基本原理之XMLHttpRequest
AJAX的基本原理
AJAX 组成
1.表示 XHTML+CSS
2.动态显示和交互 DOM
3.数据交互和操作 XML、XSLT
4.异步数据获取 XMLHttpRequest
5.绑定和处理数据 JavaScript
----------------------------------------
AJAX 基本流程
提交
1. XMLHttpRequest————>请求
返回 分析
2、3. 服务器————>数据———-->JavaScript处理------>html呈现
XMLHttpRequest 对象属性
XMLHttpRequest是XMLHttp组件的对象，通过这个对象，Ajax可以像桌面应用程序一样只与服务器进行数据层的交换，而不必每次都刷新界面，也不必每次将数据处理的工作都交给服务器来做；这样既减轻了服务器负担又回忆了响应速度，缩短了用户的等待时间。
onreadystatechange:指定当readyState属性改变时的事件处理句柄，属性只写。
XMLHttpRequest对象属性onreadystatechange是readyState状态改变的事件触发器，用来指定当readyState属性发生改变时的处理事件。
在使用过程中，通常通过将事件处理函数名称赋予onreadystatechange的方式，来为XMLHttpRequest指定事件触发器，而在事件处理函数中判
断readyState状态值并做相应的处理。
如上：http_request.onreadystatechange = processRequest;processRequest作为事件处理函数，并在processRequest函数体内在
readyState状态为 4 时开始执行。
readyState：返回当前请求的状态，属性只读。
这些状态用长度为４的整形数据表示，其属性的状态含义如下：
0：未初始化（对象已经建立，但是未初始化，即尚未调用open方法创建http请求）
1：初始化（对象已经建立，但是未调用send方法发送http请求）
2：发送数据（send方法已经被调用，但是当前的状态以及http头未知）
3：数据传送中（已经接收部分数据，因为响应及http头不全，这时通过response系统方法获取部分数据会出现错误）
4：传送完成（数据完毕，此时可以通过response系统方法获取完整的回应数据）
responseBody:将回应信息正文以unsigned byte 数组形式返回，属性只读。
responseText:以字符串的形式返回服务器响应信息，属性只读。
responseXML:将响应信息格式化为XML Document对象返回，属性只读。
XMLHttpRequest对象的方法以及含义如下：
abort：取消当前请求；
语法：http_request.abort();调用此方法，当前请求返回uninitialized状态。
getAllResourceHeaders:获取相应的全部http头信息；像JSP中的HttpServletRequest对象一样，获取http请求的 请求头信息，语法
：headers = http_request.getAllResourceHeaders();
getResourceHeader:从响应信息中获取指定的http头信息。
语法：head = http_request.getResourceHeader("header-name");
open:创建一个新的http请求，并指定此请求的方法，URL，以及验证信息（用户名/密码）。
语法：http_request.open(method,url,async,user,password);
async为布尔值，指定请求是否异步方式，默认为true;如果为真，当state状态改变时会调用onreadystatechange属性指向的回调函数
。如果服务器需要验证，则应该指定用户名和密码 。
send:发送请求到http服务器并接收回应。创建http请求后，就可以向服务器发送http请求，send方法被调用
语法：http_request.send(varBody);
参数varBody为要发送给服务器的内容。如果没有内容要发送，varBody参数可以省略,但最好写为null,因为如果省略不写在Firfox中会
报错，所以就为http_request.send(null);。此方法的同步或异步方式取决于open方法中的async参数。
setRequestHeader:单独设定请求的某个头。
status:返回当前HTTP请求的状态码，属性只读。如：404＝“文件未找到”，200＝“成功”
statusText:返回当前HTTP请求的状态行，属性只读。
XMLHttpRequest 的创建
＜script language="javascript" type="text/javascript"＞
var request;
function createRequest() {
try {
request = new XMLHttpRequest();
} catch (trymicrosoft) {
try {
request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (othermicrosoft) {
try {
request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (failed) {
request = false;
}
}
}
if (!request)
alert("Error initializing XMLHttpRequest!");
}
＜/script＞
