用原生JS对AJAX做简单封装的实例代码
首先，我们需要xhr对象。这对我们来说不难，封装成一个函数。
varcreateAjax=function(){varxhr=null;try{//IE系列浏览器xhr=newActiveXObject("microsoft.xmlhttp");
}catch(e1){try{//非IE浏览器xhr=newXMLHttpRequest();
}catch(e2){window.alert("您的浏览器不支持ajax，请更换！");
}
}returnxhr;
};
然后，我们来写核心函数。
varajax=function(conf){//初始化//type参数,可选vartype=conf.type;//url参数，必填varurl=conf.url;//data参数可选，只有在post请求时需要vardata=conf.data;//datatype参数可选vardataType=conf.dataType;//回调函数可选varsuccess=conf.success;if(type==null){//type参数可选，默认为gettype="get";
}if(dataType==null){//dataType参数可选，默认为textdataType="text";
}//创建ajax引擎对象varxhr=createAjax();//打开xhr.open(type,url,true);//发送if(type=="GET"||type=="get"){
xhr.send(null);
}elseif(type=="POST"||type=="post"){
xhr.setRequestHeader("content-type","application/x-www-form-urlencoded");
xhr.send(data);
}
xhr.onreadystatechange=function(){if(xhr.readyState==4&&xhr.status==200){if(dataType=="text"||dataType=="TEXT"){if(success!=null){//普通文本success(xhr.responseText);
}
}elseif(dataType=="xml"||dataType=="XML"){if(success!=null){//接收xml文档success(xhr.responseXML);
}
}elseif(dataType=="json"||dataType=="JSON"){if(success!=null){//将json字符串转换为js对象success(eval("("+xhr.responseText+")"));
}
}
}
};
};
最后，说明一下此函数的用法。
ajax({type:"post",
url:"test.jsp",
data:"name=dipoo&info=good",
dataType:"json",
success:function(data){alert(data.name);}});
以上这篇用原生JS对AJAX做简单封装的实例代码就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持毛票票。