Ajax实战(3):结果分类

网络整理 - 07-26

我们接着上篇改造请求数继续讲解。中的x指的是XML,早期的数据格式都喜欢用XML,然后一层层的解析。当然简单的也会返回HTML(或称HTML片段)。
现在使用ON格式的也很多。根据不同需求,给Ajax对象添加了三个实用方法:Ajax.text、Ajax.json、Ajax.xml。

Ajax.text返回纯文本,即responseText

Ajax.json返回json,即会将responseText解析成js对象

Ajax.xml返回xml文档,即responseXML

使用方式与Ajax.request相同,第一个参数是请求url,第二个是配置参数。

完整代码

Ajax = function(){function request(url,opt){function fn(){}var async = opt.async !== false,method = opt.method || 'GET',type = opt.type || 'text',encode = opt.encode || 'UTF-8',data = opt.data || null,success = opt.success || fn,failure = opt.failure || fn;method = method.toUpperCase();if(data && typeof data == 'object'){//对象转换成字符串键值对data = _serialize(data);}if(method == 'GET' && data){ url += (url.indexOf('?') == -1 ? '?' : '&') + data;data = null; }var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');xhr.onreadystatechange = function(){_onStateChange(xhr,type,success,failure);};xhr.open(method,url,async);if(method == 'POST'){xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded;charset=' + encode);}xhr.send(data);return xhr;}function _serialize(obj){var a = [];for(var k in obj){var val = obj[k];if(val.constructor == Array){for(var i=0,len=val.length;i<len;i++){a.push(k + '=' + encodeURIComponent(val[i]));}}else{a.push(k + '=' + encodeURIComponent(val));}}return a.join('&');}function _onStateChange(xhr,type,success,failure){if(xhr.readyState == 4){var s = xhr.status, result;if(s>= 200 && s < 300){switch(type){case 'text':result = xhr.responseText;break;case 'json':result = function(str){return (new Function('return ' + str))();}(xhr.responseText);break;case 'xml':result = xhr.responseXML;break;}success(result);}else{failure(xhr);}}else{}}return (function(){var Ajax = {request:request}, types = ['text','json','xml'];for(var i=0,len=types.length;i<len;i++){Ajax[types[i]] = function(i){return function(url,opt){opt = opt || {};opt.type = types[i];return request(url,opt);};}(i);}return Ajax;})();}();