利用ajax异步获取数据封装，包含同源策略下和跨域策略先的封装

同原策略：创建ajax

function myAjaxNoraml(obj){
           
    var defaults={
       type:"get",
       url:"#",
       dataType:"json",
       data:{},//用对象存储参数
       async:true,
       success:function(result){
           console.log(result)
       }
           
   }

   //让obj中的属性，覆盖到default中的属性
   for(var key in obj){
       defaults[key]=obj[key]
   }

    var  xhr=null
    if(window.XMLHttpRequest){
        xhr=new XMLHttpRequest()
    }
    else{
        xhr=new ActiveXObject("Microsoft.XMLHTTP")
    }

    //得到params
    var params=""
    for(var  attr in defaults.data){
        params+=attr+"="+defaults.data[attr]+"&"
    }
    if(params){
        params=params.substring(0,params.length-1)
    }
    //判断类型
    if(defaults.type=="get"){
        defaults.url+="?"+params
    }
    xhr.open(defaults.type,defaults.url,defaults.async)
    
    if(defaults.type=="get"){
        xhr.send(null)
    }
    else if(defaults.type=="post"){
        xhr.setRequestHeader("content-type","application/x-www-form-urlencoded")
        xhr.send(params)
    }


    if(defaults.async){
        xhr.onreadystatechange=function(){
            if(xhr.readyState==4){
                if(xhr.status==200){
                    var result=null
                    if(defaults.dataType=="json"){
                        result=xhr.responseText
                        result=JSON.parse(result)
                    }else if(defaults.dataType=="xml"){
                        result=xhr.responseXML
                    }else{
                        result=xhr.responseText
                    }
                   
                    defaults.success(result)

                }
            }
        }
    }
   else {
    if(xhr.status==200){
                    var result=null()
                    if(defaults.dataType=="json"){
                        result=xhr.responseText
                        result=JSON.parse(result)
                    }else if(defaults.dataType=="xml"){
                        result=xhr.responseXML
                    }else{
                        result=xhr.responseText
                    }
                    defaults.success(result)

                }
   }

}

跨域下，使用动态创建script标签来请求服务器的数据

function  myAjaxCross(obj){
    var defaults={
        type:"get",
        url:"#",
        data:{},
        dataType:"jsonp",
        success:function(data){},
        jsonp:"cb",
        jsonpCallback:"hehe"
    }
    //1替换defaults
    for(var key in obj){
        defaults[key]=obj[key]
    }

    //准备工作，将用户的数据写成参数形式
    var params=""
    for(var attr in defaults.data){
        params+=attr+"="+defaults.data[attr]+"&"
    }
    if(params){
        params=params.substring(0,params.length-1)
        defaults.url+="?"+params
    }
   // defaults.url+="&cb=haha"
    defaults.url+="&"+defaults.jsonp+"="+defaults.jsonpCallback
    //2 创建script标签
    var script=document.createElement("script")
   //3指定script的src属性
    script.src=defaults.url
    //4 将callback补全,添加到defaults的url中
     
    //5.声明自己定义的回调函数，自定义函数的名字
    window[defaults.jsonpCallback]=function(data){
        defaults.success(data)
    }

    //6 将script添加到文档中
    var head=document.querySelector("head")
    head.appendChild(script)
}

将两个方法结合起来

function myAjax (obj){
    if(obj.dataType=="jsonp"){
        myAjaxCross(obj)}
    else{
        myAjaxNoraml(obj)
    }   

}