AJAX JSONP JSON XML

你的名字 2021-01-09 09:41 547阅读 0赞

### ajax使用 ###

XHR一级

1.创建一个ajax对象--request;
    function createrequest(){
        try{request=new XMLHttpRequest();}
        catch(a){
        try{request=new ActiveXObject('Msxml2.XMLHTTP');}
        catch(b){
        try{request=new ActiveXObject('Microsoft.XMLHTTP');}
        catch(failed){
            request=null;
        }
        }
        }
        return request;
    }
    
    2.处理数据
    GET:
    URL处理---
    function URLserialize(url,name,value){
        url+=(url.indexOf("?")==-1?"?":"&");
        url+=name;
        url+="="+value;
        return url;
    };
    
    POST:
    var a={...};---对象a;
    var b=JSON.stringify(a);---将a转为json;
    data="data="+b;
    或者
    var data="Name=Bill&LastName=Gates";
        request.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
    读取---设置http表头,使提交和提交表单类似,才能通过$_post['data/name']来读取;
    
    3.发送数据--通过request对象的两个方法
    requset.open("GET/PSOT","URL",true/false);
    request.send(null/post_data);
    
    4.接受数据--一个事件,5个属性
    request.onreadystatechange=function(){
        if(request.readyState===4){
            if(request.status>=200&&request.status<300||request.status===304){
                data=request.responseText;
            }
        }
    }
    
    事件:readystatechange---readyState改变就会触发;
    属性:
    1.readyState--服务器状态码 
        未调用open-0;
        准备发送-1;
        服务器正在处理-2;
        值已经返回,但是还不能使用-3;
        准备就绪-4;
    2.status--http协议状态码;
    3.statusText---状态说明;
    4.resposeXML---如果返回类型是xml,则保存在这里;
    5.responseText---接受返回的文本;

关于跨域:IE8就有XDR类型来跨域;  
ie10与其他浏览器可以使用绝对地址来实现跨域,只是不能自定义信息头与接受发送cookie;

### jsonp ###

动态生成请求js文件`<script src="xxx"><script>` ,服务器端通过动态生成的js文件来实现跨域传递数据;

var cat = function(food){
        alert("cat eat"+food)
    };
    var url = "服务器地址?name=value&callback=回调函数名cat";
    请求name为value对应的数据,返回后开始调用回调函数;
    var script = document.createElement('script');
    script.setAttribute('src',url);
    document.getElementsByTagName('head')[0].appendChild(script);
    建立了一个请求,然后服务器端返回json数据;
    
    
    后台返回的是 回调函数({数据});
    ?>

### json ###

序列化:  
var a=JSON.stringify(b,过滤器,缩进)  
过滤器:  
数组--只保留数组中的值的属性的字符串  
函数--接受key与value,然后返回处理后的value;  
缩进:  
数值--缩进的空格数  
字符--转义字符或者其他字符  
值为函数或者undefined会被省略  
解析:  
JSON.parse();

### XML ###

1.xml是用来传输数据,html是显示数据  
2.xml不会作任何事,只是结构化,存储和传输数据

1.必须要一个根元素
2.属性值必须加引号
3.空格会被保留
4.正确嵌套
5.必须关闭
6.注释和html中一样
7.区分大小写
8.命名规则: 字母开头,然后可以加数字,符号等,不能带空格和以xml开始;