初识Ajax

kejianjun01

Ajax是一种构建网页的一种综合使用JavaScript和XML技术；
 
Ajax全称:Asynchronous JavaScript and XML;
 
Ajax与HTML的区别:
 
       HTML是比较传统的传输方式(同步传输:由客户向服务器段发出请求,得到服务器端的响应后才给出响应);而ajax则运用的技术是异步传输技术,在等待服务器端的响应同时用户依旧可以于服务器进行交互;页面不用刷新就可以得到更新的内容;
 
虽然可以使用户感觉更好更方便,但是也不可滥用;
 
典型流程:<1>:客户端触发异步操作;
             <2>:创建新的XMLHttpRequest对象;
             <3>:与Servlet进行连接;
             <4>:服务器端进行连接处理;
             <5>:返回包含处理结果的XML文档;
             <6>:XMLHttpRequest对象接受处理结构并分析;
             <7>:更新页面;
 
XMLHttpRequest
 
     重要的JavaScript对象,通过对它提起对服务器端的请求;
     可以通过JavaScript提起请求;如果提起多个请求,则需要多个XHR对象;
     请求的结果被预先定义好的方法处理;
 
例如：客户端触发:
<input type="text" size="20" id="userid" name="username" >
 
创建一个XHR:
var req;function validate(){var  idField = document.getElementByld("userid");var url="validate.jsp?id="+escape(idField.value)   if(window.xmlHttpRequest){         req = new XMLHttpRequest();   }else if(window.ActiveObject){         req = new ActiveXObject("Microfost.XMLHTTP") ;   }    req.open("GET",url,true);    req.onreadystatechange=callback;    req.send(null);} 
XHR特定方法:
functioin callback(){   if(req.readyState == 4){      if(req.status==200){        /*status:返回当前HTTP请求的状态码,属性只读;如:404文件未找到;200成功；*/        //处理msg       var msg=req.responseXML.getElementsByTagName("msg")[0];       setMsg(msg.childNodes[0].nodeValue);      }   }}