工作中一直有写JS，也一直有用jquery,在感受jquery便利之余，也对它产生了依赖，已至于许多功能只知使用而不知原生写法，就像ajax。
今天不小心翻看了以前学习的视频，温故了一下原生ajax写法及原理，正好捣鼓捣鼓。这也是面试经常会遇到的问题，动手封装下原生的ajax函数何乐而不为了，代码如下：
function ajaxfn(obj){ /*传入一个json对象 *type:为请求方式，如get,post *data：传输的数据 *async:异步请求，默认为true *dataType：返回的数据类型 *url:这请求地址 *fnok:为请求成功时的回调，默认传入返回的数据 *fnerror:为请求失败的回调，默认传入当前的服务器状态码，如500，404 */ var xhr=null, type=obj.type?obj.type.toLowerCase():"get",//默认是get url=obj.url, data=obj.data?JSON.stringify(obj.data):null, dataType=obj.dataType?obj.dataType.toLowerCase():"text", async=true;//默认是异步 if(obj.async==false){ async=false; } //创建XMLHttpRequest对象 try{ xhr=new XMLHttpRequest(); }catch(e){ //兼容ie6 xhr=new ActiveXObject('Microsoft.XMLHTTP'); } //连接服务器 xhr.open(type,url,async); //发送请求 if(type=="post"){//如果是post请求得先设置请求头，application/x-www=form-urlencoded适合绝大多数的应用场景 xhr.setRequestHeader("content-type","application/x-www=form-urlencoded"); } xhr.send(data); //监听过程 xhr.onreadystatechange=function(){ /*readyState请求状态 *0:请求未初始化（还没有调用open()） *1:请求已经建立，但是还没有发送（还没有调用send()） *2:请求已发送，正在处理中（通常现在可以从响应中获取内容头）。 *3:请求处理中，通常响应中已有部分数据可用了，但是服务器还没有完成响应的生成。 *4:响应已经完成;可以获取并使用服务器的响应了. */ if(xhr.readyState==4){//请成完成 /*常用http状态码 *200：服务器成功返回网页 *304：未修改,使用缓存 *403：服务器拒绝请求 *404：请求的网页不存在 *503：服务器暂时不可用 *500：服务器内部错误 */ if(xhr.status==200){//返回成功 switch (dataType){ case "text"://接收到字符串 obj.fnok && obj.fnok(xhr.responseText); break; case "json"://接收到json字符串数据 obj.fnok && obj.fnok(JSON.parse(xhr.responseText)); break; case "xml"://接收到xml格式数据 obj.fnok && obj.fnok(xhr.responseXML); break; } }else{ obj.fnerror && obj.fnerror(xhr.status); } } } } }