Ajax相关

时间：2014-07-01 17:01:14 阅读：212 评论：0 收藏：0 [点我收藏+]

1.首先创建Ajax请求对象，即XMLHttpRequest对象，大多数浏览器都内建了该对象，当然大多数一般和IE6关系不大，所以针对这一点，再获得该对象时，需要做一些处理：

1 var xmlhttp;
2 if (window.XMLHttpRequest)
3   {// code for IE7+, Firefox, Chrome, Opera, Safari
4   xmlhttp=new XMLHttpRequest();
5   }
6 else
7   {// code for IE6, IE5
8   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
9   }

2.发送请求需要用到的方法。

方法	描述
open(method,url,async)	规定请求的类型、URL 以及是否异步处理请求。 method：请求的类型；GET 或 POST url：文件在服务器上的位置 async：true（异步）或 false（同步）
send(string)	将请求发送到服务器。 string：仅用于 POST 请求

方法

描述

open(method,url,async)

规定请求的类型、URL 以及是否异步处理请求。

method：请求的类型；GET 或 POST
url：文件在服务器上的位置
async：true（异步）或 false（同步）

send(string)

将请求发送到服务器。

string：仅用于 POST 请求

open->method:可选参数为“GET”和“POST”

　　　　GET：请求简单，快速。但不能发送较大的数据。

　　　　　　　携带数据时，与平时的其它的get请求格式一致。

　　　　POST:1.不希望使用缓存数据时建议使用

　　　　　　 2.发送较大的数据时建议使用

　　　　　　 3.安全性较get方法好

　　 4.post数据可为空，若有数据，则在将数据以字符串形式传入send()方法，格式为"名1=值1&名2=值2”"。

open->async:可选参数为"true"和“false”

 var xmlhttp;
            if (window.XMLHttpRequest)
            {// code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp=new XMLHttpRequest();
            }
            else
            {// code for IE6, IE5
                xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange=function()
            {
                if (xmlhttp.readyState==4 && xmlhttp.status==200)
                {
                    document.getElementById("txt").innerHTML=xmlhttp.responseText;
                }
            }
            xmlhttp.open("GET","text.txt",false);
            xmlhttp.send();
             alert("ok");

以上示例代码中，当open->async设置为false时，弹窗消息“ok”一般都会在响应文本显示之前，当其设置为true后，弹窗消息一定会在响应文本显示之后，

也就是说，设置为true后会阻塞javascript的脚本继续往下执行，需要等到请求响应完成，才继续往下执行，而设置为false,javascript会在等待服务器响应数据

的同时，继续执行代码。

3.需要添加响应头，需要用到以下方法：

方法	描述
setRequestHeader(header,value)	向请求添加 HTTP 头。 header: 规定头的名称 value: 规定头的值

方法

描述

setRequestHeader(header,value)

向请求添加 HTTP 头。

header: 规定头的名称
value: 规定头的值

4.服务器响应属性：

属性	描述
responseText	获得字符串形式的响应数据。
responseXML	获得 XML 形式的响应数据。

5.当请求被发送到服务器时，我们需要执行一些基于响应的任务。

每当 readyState 改变时，就会触发 onreadystatechange 事件。

readyState 属性存有 XMLHttpRequest 的状态信息。

属性	描述
onreadystatechange	存储函数（或函数名），每当 readyState 属性改变时，就会调用该函数。
readyState	存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。 0: 请求未初始化，未初始化，尚未调用open()方法。 1: 服务器连接已建立，启动，尚未调用send()方法。 2: 请求已接收，已发送，但未收到。 3: 请求处理中，接收数据，已收到部分数据。　　 4: 请求已完成，且响应已就绪，收到全部响应数据。
status	200: "OK" 404: 未找到页面 304：浏览器缓存数据，数据并未修改

属性

描述

onreadystatechange

存储函数（或函数名），每当 readyState 属性改变时，就会调用该函数。

readyState

存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。