先封装一个属于自己的ajax方法
function myAjax(type,url,params,dataType,callback,async){ var xhr = new XMLHttpRequest() if(type == 'get'){ if(params && params != ''){ url = url + '?' + params } } xhr.open(type,url,true) if(type == 'post'){ xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded') xhr.send(params) }else if(type == 'get'){ xhr.send(null) } if(async){ xhr.onreadystatechange = function(){ if(xhr.readyState == 4){ if(xhr.status == 200){ var result = null if(dataType == 'json'){ result = xhr.responseText result = JSON.parse(result) }else if(dataType == 'xml'){ result = xhr.responseXML }else{ result = xhr.responseText } callback && callback(result) } } } }else{ if(xhr.readyState == 4){ if(xhr.status == 200){ var result = null if(dataType == 'json'){ result = xhr.responseText result = JSON.parse(result) }else if(dataType == 'xml'){ result = xhr.responseXML }else{ result = xhr.responseText } callback && callback(result) } } } } 这样封装的函数存在缺点，参数太多，顺序会乱，有一些常用的属性可以没必要去传
所以我们可以这样封装
var obj = { type:'get', url:'url', data:{ xxx:xxx }, dataType:'json', success:function(result){ } } function myAjax(obj){ var defaults = { type:'get', url:'url', data:{ xxx:xxx }, dataType:'json', success:function(result){ }, async:true } for(var k in obj){ defaults[k] = obj[k] } var xhr = new XMLHttpRequest() 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'){ if(params && params != ''){ defaults.url += '?' + params } } xhr.open(defaults.type,defaults.url,defaults.async) if(defaults.type == 'post'){ xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded') xhr.send(params) }else if(defaults.type == 'get'){ xhr.send(null) } 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 && defaults.success(result) } } } }else{ 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 && defaults.success(result) } } } }