1.text/html格式 这种返回类型处理很简单，直接就当作字符串用就行了.为了方便使用，封装成如下函数:
/** * @function 利用ajax动态交换数据(text/html格式) * @param url 要提交请求的页面 * @param jsondata 要提交的数据,利用json传递 * @param getmsg 这个函数可以获取到处理后的数据 */ function ajaxtext(url,jsondata,getmsg) { //创建ajax对象,activexobject兼容ie5,6 var oajax = window.xmlhttprequest?new xmlhttprequest():new activexobject(microsoft.xmlhttp); //打开请求 oajax.open('post',url,true);//方法,url,异步传输 //发送请求 var data = ''; for(var d in jsondata) //拼装数据 data += (d + '=' +jsondata[d]+'&'); oajax.setrequestheader(content-type,application/x-www-form-urlencoded); oajax.send(data); //接收返回,当服务器有东西返回时触发 oajax.onreadystatechange = function () { if(oajax.readystate == 4 && oajax.status == 200) { if(getmsg) getmsg(oajax.responsetext); } } }
服务器端返回数据格式如下:
例如:
//返回的是xml格式 //header(content-type:text/xml;charset=utf-8); //返回的是text或json格式 header(content-type:text/html;charset=utf-8); //禁用缓存,是为了数据一样的前提下还能正常提交，而不是缓存数据 header(cache-control:no-cache); $username = $_post['username']; //获取用户名 if(empty($username)) echo '请输入用户名'; else if($username == 'acme') echo '用户名已被注册'; else echo '用户名可用';
调用格式如下:
url = 'abc.php'; var jsondata={username:'acme',passw:'acme'}; ajaxtext(url,jsondata,getmsg); function getmsg(msg) { //do something }
2.xml格式
返回的是一个xml dom对象，解析其中的数据就类似于html dom 编程. 比如通过name获取标签对象(数组形式)，再从该数组中获取需要的标签对象，再从标签对象中获取文本值.
函数如下:
/** * @function 利用ajax动态交换数据(xml格式) * @param url 要提交请求的页面 * @param jsondata 要提交的数据,利用json传递 * @param tagname 要获取值的标签名 * @param getmsg 这个函数可以获取到处理后的数据 */ function ajaxxml(url,jsondata,tagname,getmsg) { //创建ajax对象,activexobject兼容ie5,6 var oajax = window.xmlhttprequest?new xmlhttprequest():new activexobject(microsoft.xmlhttp); //打开请求 oajax.open('post',url,true);//方法,url,异步传输 //发送请求 var data = ''; for(var d in jsondata) //拼装数据 data += (d + '=' +jsondata[d] + '&'); oajax.setrequestheader(content-type,application/x-www-form-urlencoded); oajax.send(data); //接收返回,当服务器有东西返回时触发 oajax.onreadystatechange = function () { if(oajax.readystate == 4 && oajax.status == 200) { var oxml = oajax.responsexml; //返回的是一个xml dom对象 var otag = oxml.getelementsbytagname(tagname); var tagvalue = otag[0].childnodes[0].nodevalue; if(getmsg)getmsg(tagvalue); } } }
服务器端返回数据格式如下:
例如:
//返回的是xml格式 header(content-type:text/xml;charset=utf-8); //返回的是text或json格式 //header(content-type:text/html;charset=utf-8); //禁用缓存,是为了数据一样的前提下还能正常提交，而不是缓存数据 header(cache-control:no-cache); $username = $_post['username']; //获取用户名 if(empty($username)) echo '<user><mes>请输入用户名</mes></user>'; //这些标签可以自定义 else if($username == 'acme') echo '<user><mes>用户名已被注册</mes></user>'; else echo '<user><mes>用户名可用</mes></user>';
调用格式如下:
var url = 'abc.php'; var jsondata = {username:'acme'}; ajaxxml(url,jsondata,'mes',getmsg); function getmsg(msg) { //do something }
3.返回json
函数如下：
/** * @function 利用ajax动态交换数据(text/html格式)，但是返回的是json类型的文本数据 * @param url 要提交请求的页面 * @param jsondata 要提交的数据,利用json传递 * @param getmsg 这个函数可以获取到处理后的数据 */ function ajaxjson(url,jsondata,getmsg) { //创建ajax对象,activexobject兼容ie5,6 var oajax = window.xmlhttprequest?new xmlhttprequest():new activexobject(microsoft.xmlhttp); //打开请求 oajax.open('post',url,true);//方法,url,异步传输 //发送请求 var data = ''; for(var d in jsondata) //拼装数据 data += (d + '=' +jsondata[d] + '&'); oajax.setrequestheader(content-type,application/x-www-form-urlencoded); oajax.send(data); //接收返回,当服务器有东西返回时触发 oajax.onreadystatechange = function () { if(oajax.readystate == 4 && oajax.status == 200) { var json = eval('('+oajax.responsetext+')');//把传回来的字符串解析成json对象 if(getmsg)getmsg(json); } } }
服务器端返回数据格式如下:
例如:
//返回的是xml格式 //header(content-type:text/xml;charset=utf-8); //返回的是text或json格式 header(content-type:text/html;charset=utf-8); //禁用缓存,是为了数据一样的前提下还能正常提交，而不是缓存数据 header(cache-control:no-cache); $username = $_post['username']; //获取用户名 if(empty($username)) echo '{mes:请输入用户名}'; else if($username == 'acme') echo '{mes:用户名已被注册}'; else echo '{mes:用户名可用}';
调用格式如下:
url = 'abc.php'; var jsondata={username:'acme',passw:'acme'}; ajaxtext(url,jsondata,getmsg); function getmsg(msg) { //do something }
为了方便使用，可以把三个函数合并.合并后的函数如下:
/** * @function 利用ajax动态交换数据 * @param url 要提交请求的页面 * @param jsondata 要提交的数据,利用json传递 * @param getmsg 这个函数可以获取到处理后的数据 * @param type 接受的数据类型,text/xml/json * @param tagname type = xml 的时候这个参数设置为要获取的文本的标签名 * @return 无 */ function ajax(url,jsondata,getmsg,type,tagname) { //创建ajax对象,activexobject兼容ie5,6 var oajax = window.xmlhttprequest?new xmlhttprequest():new activexobject(microsoft.xmlhttp); //打开请求 oajax.open('post',url,true);//方法,url,异步传输 //发送请求 var data = ''; for(var d in jsondata) //拼装数据 data += (d + '=' +jsondata[d]+'&'); oajax.setrequestheader(content-type,application/x-www-form-urlencoded); oajax.send(data); //接收返回,当服务器有东西返回时触发 oajax.onreadystatechange = function () { if(oajax.readystate == 4 && oajax.status == 200) { if(type == 'text') { if(getmsg) getmsg(oajax.responsetext); } else if(type == 'json') { var json = eval('('+oajax.responsetext+')');//把传回来的字符串解析成json对象 if(getmsg)getmsg(json); } else if(type == 'xml') { var oxml = oajax.responsexml; //返回的是一个xml dom对象 var otag = oxml.getelementsbytagname(tagname); var tagvalue = otag[0].childnodes[0].nodevalue; if(getmsg)getmsg(tagvalue); } } } }
相信看了本文案例你已经掌握了方法，更多精彩请关注其它相关文章！
推荐阅读：
ajax异步下载文件
怎么操作ajax返回html标签样式
ajax怎么使文件与图片异步上传
以上就是ajax可以处理服务器返回哪些数据类型？的详细内容。