ajax应用实现

创建XMLHttpRequest，因为windows操作系统可能不一样所以调用不同的创建方式：

//创建XMLHttpRequest
  function createXMLHttpRequest(){
      if(window.ActiveXObject){
         xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
         }
      else if(window.XMLHttpRequest){
          xmlHttp=new XMLHttpRequest();
       }
  }

这里我在服务器端的servlet-mapping为

<servlet-mapping>
    <servlet-name>GetBusInformation</servlet-name>
    <url-pattern>/GetBusInformation</url-pattern>
  </servlet-mapping>

所以接下来的url我需要设置为url=”GetBusInformation?timeStamp=”+new Date().getTime();
“+”号后面的为传递的参数

//最原始的实时调度调用函数,为发出请求调用的函数，点击按钮的时候开始执行,执行open后才会再次进入handleStateChange()这个方法,执行send后会再次进入handleStateChange()这个方法,
  //这个时候xmlHttp.readyState会一直往后执行，一直到状态4为止，这时数据就返回了。
  function startRequest(){

     var url="GetBusInformation?timeStamp="+new Date().getTime();
     createXMLHttpRequest();
     xmlHttp.onreadystatechange=handleStateChange;//设置返回值处理函数
     xmlHttp.open("POST",url,true);
     xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;");
     xmlHttp.send(null);
  }

如果一切进展顺利会执行下面这个函数：

//每当 XMLHTTP 对象的状态发生改变时，handleStateChange() 函数就会执行。
  function handleStateChange(){
    if(xmlHttp.readyState==4){
     if(xmlHttp.status==200){
       listAllBus();
    }
   }
  }

下面的 listAllBus()就是接收XML文件

//车辆的实时显示
//定义var latitude=new Array()的地方。
 function listAllBus(){
 //到底是获取的哪里的值
  var xmlDoc=xmlHttp.responseXML;
  var allBusInfo=xmlDoc.getElementsByTagName("Location");
  outputList("All Bus information in Document",allBusInfo);
 }