ajax知识总结

梦里梦外; 2022-06-15 12:21 182阅读 0赞

**1. 使用XMLHttpRequest获取数据：open()和send()**

*  open(method,url,anync)  
    
    
     *  method：get/post.
     *  url:接受数据的地址
     *  anync:提交方式，true表示异步/false表示同步
 *  send(string)  
    
    
     *  如果提交方式是get，string=null
     *  如果提交方式是post，string=需要发送的信息

//补充
    //设置HTTP头信息，必须放在open和send之间。
    
    request.setRequestHeader('');
    
    //
    //

**2.XMLHttpREquset取得响应**

<table> 
 <thead> 
  <tr> 
   <th>responseText</th> 
   <th align="center">获得以字符串形式返回的响应数据</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>responseXML</td> 
   <td align="center">获得以XML形式返回的响应数据</td> 
  </tr> 
  <tr> 
   <td>stastus和statusText</td> 
   <td align="center">以数字和文本形式返回HTTP状态码</td> 
  </tr> 
  <tr> 
   <td>getAllResponseHeader</td> 
   <td align="center">获得所有响应报头</td> 
  </tr> 
  <tr> 
   <td>getResponseHeader</td> 
   <td align="center">查询响应中某个字段的值</td> 
  </tr> 
 </tbody> 
</table>

--------------------

**readyStatus属性**

<table> 
 <thead> 
  <tr> 
   <th>4</th> 
   <th align="center">请求已完成且响应已就绪</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>0</td> 
   <td align="center">请求还未初始化，open还未调用</td> 
  </tr> 
  <tr> 
   <td>1</td> 
   <td align="center">服务器已建立链接，open已调用</td> 
  </tr> 
  <tr> 
   <td>2</td> 
   <td align="center">请求已经接收，接收到头信息</td> 
  </tr> 
  <tr> 
   <td>3</td> 
   <td align="center">请求处理中，接收到响应主体</td> 
  </tr> 
 </tbody> 
</table>

--------------------

**示例**

//发送请求并处理 --js--
    //使用GET方式提交，执行异步提交到server.php
    function(){ 
        var request=new XMLHttpRequest();
        request.open("GET","server.php",true);
        request.send();
        //通过onreadystatuschange事件验证
        request.onreadystatechange=function(){ 
            if(request.readyStatus===4&&request.status===200)
            {
                //如果请求成功，则进行这部分操作
            }else{
                alert("发生错误"+request.readyStatus);
            }
        }
    }

//增加、修改 --js--
    //使用POST方式提交，执行异步提交到server.php
    function(){ 
        var request=new XMLHttpRequest();
        request.open("POST","server.php",true);
        //假设从表单中获取数据
        var data="name="+document.getElementById('name').value
        +"&age="+document.getElementById('age').value;
        //设置HTTP头信息
        request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
        //post方式下提交信息
        request.send(data);
        //通过onreadystatuschange事件验证
        request.onreadystatechange=function(){ 
            if(request.readyStatus===4&&request.status===200)
            {
                //如果请求成功，则进行这部分操作
            }else{
                alert("发生错误"+request.readyStatus);
            }
        }
    }