ajax总结

一，什么是ajax？
ajax是异步请求，用于创建快速动态网页的技术，实现网页的一步更新。
二，原声ajax创建

//get请求，sever.php?name="..."&age="..."
    var xhr=new XMLHttpRequest();
    xhr.open("GEt","sever.php");
    xhr.send();
    xhr.onreadystatechange=function(){
        if(xhr.readyState==4&&xhr.status==200){
            //业务逻辑
        }else{
            //报错
        }
    };
//post请求，必须要写请求头，必须写在set和open中间
    xhr.open("POST","sever.php");
    var data=".....";//需要发送的信息
    xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");//post请求必需写
    xhr.send(data);//需要发送信息
    xhr.onreadystatechange=function(){
        if(xhr.readyState==4&&xhr.status==200){}else{}
    };

三，jQuery写法

//GET请求，不需要data
    $(document).ready(function(){
        $.ajax({
            type:"GET",
            url:"sever.php",
            dataType:"json",
            success:function(){},
            error:function(jqXHR){}
        })
    });
//post请求需要data
    $(document).ready(function(){
        $.ajax({
            type:"POST",
            url:"sever.php",
            dataType:"json",
            data:{
                //键值对
            },
            success:function(){},
            error:function(){}
        })
    });

四、跨域请求
1、什么是跨域？
协议、子域名、主域名、端口号中任意一个不相同时，都算作不同域。不同域之间相互请求资源，算作跨域。
2、跨域原因
JavaScript不允许跨域调用其它页面对象，JavaScript同源策略限制。
3、解决办法
①代理（后端完成）
②ＪＳＯＮＰ可以解决主流浏览器ＧＥＴ请求跨域访问的问题

//jsonp解决跨域问题原理
    /*
    * 先在第一个域名下面建一个jsonp方法，第二个域名去调用。
    */
    //第一个域名www.abc.com
    function jsonp(){
        alert(json["name"])
    }
    //第二个域名scr="jsonp.js"  www.efg.com
    jsonp({'name':'红旗','age':20});
    //ajax做的改动把json换成jsonp，添加一个属性jsonp:"callback"
    $(document).ready(function(){
        $.ajax({
            type:"GET",
            url:"sever.php",
            dataType:"jsonp",
            jsonp:"callback",
            success:function(){},
            error:function(jqXHR){}
        })
    });

③改动服务器端添加代码

header("Access-Control-Allow-Origin:*");//*表示所有域名都可以访问，也可以写固定域名
header("Access-Control-Allow-Methods:POST,GET");

五、一些其它知识
ＧＥＴ和ＰＯＳＴ区别：
ｇｅｔ：获取查询数据，简单快捷
ｐｏｓｔ：发送，提交数据。无法缓存文件，向服务器发送大量数据，发送包含未知字符的用户输入时。
ｐｏｓｔ请求在有请求头的情况下，要使用setRequestHeader(“Content-Type”,”application/x-www-form-urlencoded”)添加ｈｔｔｐ头，然后在ｓｅｎｄ（）方法中添加想要发送的数据。