AJAX学习笔记
参考馮彥文的《AJAX 的 client/server 溝通機制探究》
AJAX是Asynchronous JavaScript And XML的缩写
主要用到XHTML&CSS、DOM、JavaScript、XMLHttpRequest技术
基本的过程
// 建立 XHR
request = new XMLHttpRequest();
// 設定回呼函式
request.onreadystatechange=handleResponse;
// 開啟連結
request.open("GET","http://abc.com",true);
// 傳送資料
request.send(null);
function handleResponse() {
// 檢查 XHR 狀態
if(request.readyState == 4){
// 檢查 http 狀態
if(request.status == 200){
// 讀取回傳 XML 資料
var doc = request.responseXML;
// 取得網頁上需被更新的 node 位置
var node = document.getElementById(“resp");
// 設定該 node 的內容
node.innerHTML =
doc.documentElement.childNodes[0].nodeValue;
}
}
}
//因为浏览器支持的方式不同,IE的支持方式老,所以前面建立XHR实际应该如下:
function httpRequest(reqType,url){
if(window.XMLHttpRequest){ // Mozilla, Opera, Safari, …
request = new XMLHttpRequest();
} else if (window.ActiveXObject){ // IE
request=new ActiveXObject("Msxml2.XMLHTTP");
if (!request){
request=new ActiveXObject("Microsoft.XMLHTTP");
}
}
if(request){
…
} else {
alert("Your browser does not permit the use of all "+
"of this application's features!");
}
}
AJAX可以传TEXT,HTML,XML,JAVASCRIPT.
XHR 限制僅能存取該網站上的資料, 無法存取其他網站的資料.