位置:海鸟网 > IT > XML >

XMLHttpRequest对象简介

什么是XMLHttpRequest对象

一个页面可以通过一个HttpRequest发送一个请求来获取服务器响应,而当前页面不做刷新。
通过使用XMLHttpRequest对象,开发者可以在不刷新当前页面的情况下更新当前页面的数据。
注:XMLHttpRequest对象不是W3C标准,不过目前已有以下浏览器支持此对象操作:IE5.0+,Safari1.2,Mozilla1.0,Firefox,Netscape7。

创建一个XMLHttpRequest对象

要创建XMLHttpRequest对象,可以采用以下方法:

对于IE:

var xmlhttp=new ActiveXObject("Microsoft.XMLHTTP")



对于For Mozilla, Firefox, Safari, and Netscape:

var xmlhttp=new XMLHttpRequest()



XMLHttpRequest对象引用

方法:

方法 
描述 

abort
取消当前请求
 
getAllResponseHeaders()
获取完整的Http header信息
 
getResponseHeader(headername)
获取指定的Http header信息
 
open(method,url,async,user,passwd)
打开一个请求。
method-指定请求方法get或post
url-请求的url
async-指定异步请求响应。true表示发送请求后不等待回应而去执行别的操作;false表示请求后等待回应后才去继续别的操作。
user-访问用户(可选)
passwd-访问密码(可选)
 
send(content)
发送请求
 
setRequestHeader("label","value")
设置请求头部信息
 

属性:

属性名 
描述 

onreadystatechange
一个事件,用来捕获所有的状态变换
 
readyState
返回对象状态:
0 = uninitialized
1 = loading
2 = loaded
3 = interactive
4 = complete
 
responseText
响应文本
 
responseXML
响应XML数据
 
status
返回状态数字(如:”404”表示“Not Found” “200”表示“OK”)。
 
statusText
返回状态文本(如:“Not Found” ,“OK”)

一个小例子

test1.jsp创建一个XMLHttpRequest对象,并从服务器获取服务器时间填充到当前页面指定的div中,代码如下:

<%@ page contentType="text/html;charset=gb2312" language="java" errorPage=""%>
<html>
<head>
<script language="javascript">
       var xmlhttp ;
       var url = "test2.jsp";
       if (window.XMLHttpRequest) {
             xmlhttp=new XMLHttpRequest();
      } else if (window.ActiveXObject) {
             xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
       function func_test() {           
             if (xmlhttp) {    
                   xmlhttp.open("GET", url,true);
                   xmlhttp.onreadystatechange=function() {
                         if (xmlhttp.readyState==4) {
                               document.getElementById('testdiv').innerHTML=xmlhttp.responseText; 
                         }
                  }
            }
            xmlhttp.send(null);             
       }
</script>   
</head>
<body bgcolor="#FFFFFF" >
       <input type="button" value="button" onclick="func_test()">
       <div id="testdiv">
       </div>
</body>
</html>


 
test2.jsp接收请求输入当前系统时间,代码如下:

<%@ page contentType="text/html;charset=gb2312" language="java" errorPage=""%>
<%@ page import="java.util.*"%>
<%
       out.println(Calendar.getInstance().getTime());     
%>



将此两个文件放入Tomcat中,访问test1.jsp页面,点击button,即可显示服务器时间。

由此看出,在一些开发中我们可以使用XMLHttpRequest对象来处理两次请求页面表现形式相似的情况,通过XMLHttpRequest对象来获取数据并替换当前页面的类似的数据内容,从而减少每次响应得数据流量,提高客户端的访问速度。