Ajax学习小结

原理:

          就是通过触发JavaScript事件,调用服务器程序(可以是Servlet,也可以是Action),得到所需要的值。这个值再通过载  体,返回给JavaScript,从而返回给界面,实现局部刷新!而中间的这个载体就是ActiveXObject("MSXML2.XMLHTTP");

核心流程:
 1、HTML 中执行 JavaScript
 2、JavaScript 中去实例化 xmlHttp
 3、xmlHttp 去发出请求调用后台 Servlet
 4、Servlet 返回响应给 xmlHttp
 5、xmlHttp 拿着响应信息去更新 HTML

核心代码:

<script><!---->
  var xmlHttp=new ActiveXObject("MSXML2.XMLHTTP");//只是IE的;

  function sendRequest(){
   //open方法用来设置请求发送,有三个参数(1、请求方式;2、请求地址;3、为true时用异步方式发送);
   xmlHttp.open('get','http://localhost:8080/WebModule1/ajaxservlet?name='+f.uname.value,true);
   //onreadystatechange方法设置谁来接收;
   xmlHttp.onreadystatechange=getResponse;
   //send请求真正的发出;
   xmlHttp.send(null);
  }

  function getResponse(){
   //readyState判断响应的4种状态(4为响应结束);
   if(xmlHttp.readyState==4){
    //status=200表示页面响应是正确的;400,404,500
    if(xmlHttp.status==200){
     ds.innerHTML=xmlHttp.responseText;
    }
   }
  }

</script>
 

终上所述:

          现在已经可以实现一个Ajax程序了(只用上面这两个方法就可以了)。只需在界面调用sendRequest()方法。

你可能感兴趣的:(JavaScript,html,Ajax,servlet,IE)