ajax知识总结-蒲公英云

ajax知识总结

梦里梦外; 2022-06-15 12:21 453阅读 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取得响应

responseText	获得以字符串形式返回的响应数据
responseXML	获得以XML形式返回的响应数据
stastus和statusText	以数字和文本形式返回HTTP状态码
getAllResponseHeader	获得所有响应报头
getResponseHeader	查询响应中某个字段的值

readyStatus属性

4	请求已完成且响应已就绪
0	请求还未初始化，open还未调用
1	服务器已建立链接，open已调用
2	请求已经接收，接收到头信息
3	请求处理中，接收到响应主体

示例

//发送请求并处理 --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);
        }
    }
}