一個頁面可以通過一個HttpRequest發送一個請求來獲取服務器響應,而當前頁面不做刷新。
通過使用XMLHttpRequest對象,開發者可以在不刷新當前頁面的情況下更新當前頁面的數據。
注:XMLHttpRequest對象不是W
要創建XMLHttpRequest對象,可以采用以下方法:
對於IE:
var xmlhttp=new ActiveXObject("Microsoft.XMLHTTP")
對於For Mozilla, Firefox, Safari, and Netscape:
var xmlhttp=new 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
返回狀態數字(如:”
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" >
<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對象來獲取數據並替換當前頁面的類似的數據內容,從而減少每次響應得數據流量,提高客戶端的訪問速度。