ajax个人学习笔记

前端之家收集整理的这篇文章主要介绍了ajax个人学习笔记前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
1. function createXHR(){ if(typeof XMLHttpRequest != 'undefined'){ return new XMLHttpRequest(); }else if(typeof ActiveXObject != 'undefined'){ var version = ['MSXML2.XMLHttp.6.0','MSXML2.XMLHttp.3.0','MSXML2.XMLHttp' ]; for(var i=0;i<version.length;i++){ try{ return ActiveXObject(version[i]); }catch(e){ } } }else{ throw new Error('你的系统或浏览器不支持XHR'); } } 2.IE浏览器第一次向服务器端请求,获取最新数据,其后默认获取的是缓存数据,而不是最新的数据,可以使用js中的随机字符串处理。 3.ajax异步(true)过程中需要readyState=4值的判定 4.xhr.getAllResponseHeaders();xhr.getResponseHeader();xhr.setRequestHeader();xhr.setRequestHeader('Content-Type','application/x-www-form-urlencode');模拟表单提交. 5.ajax自定义封装: function ajax(obj){ var xhr = createXHR(); obj.url = obj.url + '?rand=' + Math.random(); obj.data = params(obj.data); if(obj.method === 'get') obj.url += obj.url.indexOf("?") == -1? '?'+obj.data:'&'+obj.data; if(obj.async === true){ xhr.onreadystatechange = function(){ if(xhr.readyState ==4 ){ callback(); } }; }else{ callback(); } xhr.open(obj.method,obj.url,obj.async); if(obj.method === 'post'){ xhr.setRequestHeader('Content-Type','application/x-www-form-urlencode'); xhr.send(obj.data); }else{ xhr.send(null); } function params(data){ var arr = []; for(var i in data){ arr.push(encodeURLComponent(i) + '=' + encodeURIComponent(data[i])); } return arr.join('&'); } function callback(){ if(xhr.status == 200){ obj.success(xhr.responseText); }else{ alert('获取数据错误错误代码:'+ xhr.status + ',错误信息:'+ xhr.statusText); } } }

猜你在找的Ajax相关文章