初探AJAX

以支持多种浏览器方式创建XMLHttpRequest对象


  var xmlHttp = false;          //定义一个用于创建XMLHttpRequest的变量

  //这是针对IE浏览器的创建方式
  try{
       //首先采用第一种方式创建，如果不成功，则会跳到catch块中   
        xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
    }catch(e){
         try{
             //采用第二种方式创建,如果不成功，则变量仍旧为false
             xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");   
         }catch(e2){
             xmlHttp = false;         
        }
    } 

   //这是针对非IE浏览器的创建方式
   if(!xmlHttp && XMLHttpRequest != "undefined"){
       xmlHttp = new XMLHttpRequest();
   } 


XMLHttpRequest创建成功后，开始让它干活吧。
利用它与服务器通信，一般都会经过以下几个步骤
1，从页面表单获取数据
2，构造要连接的URL
3，打开到服务器的连接
4，设置服务器在完成后要运行的函数
5，发送请求。

一个登陆的例子代码如下：

//从页面表单获取数据
var name = document.getElementById("username").value;
var pass = document.getElementById("userpass").value;

//构造URL
var URL = "login.jsp?usrename"+name+"&userpass="+pass;

//打开到服务器的连接，最后一个参数如果为true，则采用异步连接，如果为false，则采用同步连接
xmlHttp.open("GET",URL,true);

//设置服务器在完成后运行的函数
xmlHttp.onreadystatechange=login;

//发送请求
xmlHttp.send(null);


最后，发送请求完成后，处理服务器的响应，也就是xmlHttp.onreadystatechange=login中的login
定义一个函数处理服务器的响应。
function login(){

    //状态代码为4，说明请求完成
    if(xmlHttp.readystate=4)}
          
           //状态代码为200,说明响应成功
            if(xmlHttp.readystate=200)｛
             
               //接收服务器的响应信息
               var result = xmlHttp.responseText(); 

               //让页面显示服务器的响应信息
               document.getElementById("re").value = result;     
            ｝
    }

OK，结束。