ajax 快速入门，ajax底层使用的五个步骤；XMLHttpRequest对象详解；XMLHttpRequest常用属性；XMLHttpRequest常用方法

 

一、 AJAX应用

1． AJAX快速入门

AJAX底层使用的五个步骤：

1获取XMLHttpRequest对象：ie5和6：xmlhttp=new ActiveXObject(“Microsoft.MXLHTTP”)

IE7或者其它浏览器xmlhttp= new XMLHttpRequest();

2设置一个回调函数:回调函数它的作用就是用于处理服务器响应的数据

通过XMLHttpRequest对象的onreadystatechange设置回调函数

3设置请求方式GET/POST及请求的URL等.通过XMLHttpRequest对象的open方法

4 真正向服务器发送请求.通过XMLHttpRequest对象的send方法

5在回调函数中获取服务器响应的数据/通过XMLHttpRequest对象的responseText

 

创建一个demo1.html

 代码在附件;

如何发送一个ajax请求?

1.1． 第一步:获取一个XMLHttpRequest对象

代码在附件;

 

 

1.2． 第二步:设置一个回调函数

回调函数它的作用就是用于处理服务器响应的数据

通过XMLHttpRequest对象的onreadystatechange设置回调函数

 

1.3． 第三步设置请求方式GET/POST及请求的URL等

通过XMLHttpRequest对象的open方法

 

1.4． 第四步真正向服务器发送请求

通过XMLHttpRequest对象的send方法

 

1.5． 第五步在回调函数中获取服务器响应的数据

通过XMLHttpRequest对象的responseText

 

2． XMLHttpRequest对象详解

2.1． 获取XMLHttpRequest 对象

对于大部分浏览器可以直接通过 new XMLHttpRequest();

对于IE5  IE6 new ActiveXObject("Microsoft.XMLHTTP")

 

2.2． XMLHttpRequest常用属性

1. onreadystatechange 它是用于绑定回调函数，当服务器响应数据回来后，我们可以在指定的回调函数中进行数据处理。

2. readyState 它描述的http请求的状态

 

3. status 它描述的http状态码  200 404  405 500…

 

4. 获取服务器响应数据

responesText或responseXML来获取

 

2.3． XMLHttpRequest常用方法

1. open它是用于设置请求方式，url及是否异步（并不发送请求）

参数1：HTTP 请求方式  POST/GET。

参数2:url路径

参数3:true/false 代表是否异步

 

2. send它是真正向服务器发送请求

如果请求方式是get，那么我们使用send(null) 原因:get请求方式是没有http请求体

 

只有post请求方式时，才有请求体,所以send的参数只是在post请求时使用例如

Xmlhttp.send(“username=xxx&password=xxx”);

 

3. setRequestHeader

注意：如果请求方式是POST,那么我们在使用时，必须设置一个请求头，就需要使用setRequestHeader方法来完成