AJAX

2016-12-30  本文已影响4人  duJing

http的头信息包括两种:
1、响应头信息 服务器返回的信息 客户端可以获取,但是不可以设置
客户端有两种方法获取响应头信息:
1、获取所有的响应头信息
xhr.getAllResponseHeaders())
2、获取指定的响应头信息
xhr.getResponseHeader(‘Content-Type’)
2、请求头信息 客户端发送的信息 客户端可以设置但是不可以获取
xhr.setRequestHeader(‘MyHeader’, ‘Lee’); //放在 open方法之后, send方法之前
在火狐控制台的网络里可以看到

封装一个ajax函数

function ajax(obj){
    var xhr=new XMLHttpRequest();
    obj.url=obj.url+"?random="+Math.random();
    if(obj.method==="get")
        obj.url+=obj.url.indexOf("?")==-1?+"?"+obj.data:+"&"+obj.data
    obj.data=parms(obj.data);
    if(obj.async===true){
        xhr.onreadystatechange=function(){
            if(xhr.readyState==4){
                if(xhr.status==200){
                    obj.success(xhr.responseText);
                }
            }
        }
        xhr.open(obj.method,obj.url,obj.async);
        if(obj.method==="post"){
            xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
            xhr.send(obj.data);
        }else{
            xhr.send(null);
        }
    }
    if(obj.async===false){
        if(xhr.readyState==4){
            if(xhr.status==200){
                obj.success(xhr.responseText);
            }
        }
    }
}

使用

 addEvent(document,'click',function(){
              ajax({
                  method:"get",
                  url:"demo.php",
                  data:{"name":"zwj","age":100},
                  success:function(data){
                      console.log(data);
                  },
                  async:true
              })
          })

注意回调函数的使用

function aa(obj){
    obj.success(11)
}

使用

 aa({success:function(data){
                  console.log(data)
              }})
上一篇 下一篇

猜你喜欢

热点阅读