AJAX JSONP JSON XML

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();

var a='function(){console.info(1);}'
var js={
    name1:"lh1",
    name2:a,
    name3:['1',2,3],
    "name4":{
        name5:'lh2',
        name6:'lh3'
    }
}
var  json=JSON.stringify(js,function(key,value){
    if(key==='name1'){
        return 'lh';
    }else{
        return value;
    }
},1);
var js1=JSON.parse(json);

js1={name1: "lh", name3: Array[3], name4: Object}
函数被省略,通过过滤器,改变了name1;

XML

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


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



posted @ 2017-02-18 19:28  ABC君  阅读(191)  评论(0编辑  收藏  举报