ajax工作原理

来源:互联网 发布:网络销售邮币卡可靠吗 编辑:程序博客网 时间:2024/06/03 15:29

 

 

Ajax的工作原理相当于在用户和服务器之间加了—个中间层,使用户操作与服务器响应异步化。并不是所有的用户请求都提交给服务器,像—些数据验证和数据处理等都交给Ajax引擎自己来做,只有确定需要从服务器读取新数据时再由Ajax引擎代为向服务器提交请求.

 

一般向服务器提交数据时都是通过form的post或get发送http请求来实现的,这有个缺点,提交后页面会刷新。Ajax技术通过XMLHttpRequest对象将这种http请求脚本化了,并且做到了页面无刷新。它的原理就是通过XMLHttpRequest脚本化http请求;这就是ajax的核心。如果愿意,甚至可以通过iframe,或script来脚本化(但不常用)。它仍然向服务器发送数据,只是不再通过原始的form了。

 


 

//ajax核心代码

 

<script type="text/javascript">
   
       function btnClick(){
          var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");//创建XMLHTTP对象,相当于WebClient
         
          if(!xmlhttp){
              alert("创建xmlhttp对象异常!");
              return false;
         
          }
          xmlhttp.open("POST","GetDate1.ashx?id=33&ts="+new Date(),false);//准备向服务器的GetDate1.ashx发出Post请求,XMLHTTP默认(也推荐)不是同步请求的,也就是open方法并不像WebClient的DownloadString那样把服务器返回的数据拿到才返回,是异步的,无法直接拿到send的返回值,因此需要监听onreadystatechange事件
         
          xmlhttp.onreadystatechange = function(){
              if (xmlhttp.readyState ==4){ //服务器完成(可能成功也可能失败)
                  if(xmlhttp.status==200){ //如果状态为200则是成功
                  //alert(xmlhttp.responseText);
                  document.getElementById("Text1").value = xmlhttp.responseText; //responseText属性为服务器返回的文本
                 
                  }
                  else{
                      alert("AJAX服务器返回错误!");
                  }
              }
          xmlhttp.send();//这时才开始返回请求
          }

    </script>

原创粉丝点击