最簡單的AJAX架構
上一篇提到作者在Javascript上比較不喜歡使用Library，也提到了幾個主要的原因。這時候有些朋友就問了：那都不用Library或 Framework，要怎麼作AJAX呢？因此在這邊我介紹一下作者最熟悉、最常用，也應該算是最簡單的一個AJAX架構吧！
AJAX最 主要的目的就是在不需要重新整理畫面的前提下，跟Server抓取資料，並且根據從Server抓的資料來更新變數和畫面。而在比較舊的瀏覽器版本時代， 作者都是使用iframe或是更早的隱藏的frame來達到這樣效果。而在比較新的瀏覽器版本中，都有提供這樣功能的物件，只要利用以下的一個 function，就可以在各種瀏覽器中，取得用HTTP跟Server溝通的物件。
function getHTTPObject() {
var xmlhttp=false;
if(window.XMLHttpRequest) {
try {xmlhttp = new XMLHttpRequest();}
catch(e) {xmlhttp = false;}
}else if(window.ActiveXObject) {
try {xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");}
catch(e) {
try {xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");}
catch(e) {xmlhttp = false;}
}
}
return xmlhttp;
}
那 Server要傳什麼東西回來給瀏覽器呢？我通常有兩種作法：最簡單的方式就是直接產生一段Javascript回來給Client執行，可能是用 document.getElementById抓取畫面上某個物件來修改他的內容，也可以是呼叫一些已經寫好的函式。
我通常會把這樣的 動作包成一個簡單的小函式如下：
function read(url,func,sync){
var _reader=getHTTPObject();
_reader.open(\'GET\',file,!sync);
if(!sync){
_reader.onreadystatechange = function(){
if(_reader.readyState==4){
if(func) func(_reader);
}
}
}
_reader.send(null);
if(sync) {
if(func) func(_reader);
}
}
未來要做任何AJAX動作只要傳入要呼叫的一個網址，然後傳入用來處理Server回傳值，例如直接eval回傳的Javascript，就完成了一個 AJAX的呼叫！而所有用到的程式碼沒有多少行，相信花個幾分鐘就可以瞭解，就不再需要用到一堆沒時間去瞭解，出了問題不知道怎麼修的程式碼囉！
read(‘server.jsp’,function(res){eval(res.responseText);});
