$.ajax() 调用不同类型的响应,被传递到成功处理函数之前,会经过不同种类的预处理(prefilters)。
预处理的类型取决于由更加接近默认的 Content-Type 响应,但可以明确使用 dataType 选项进行设置。如果提供了 dataType 选项, 响应的 Content-Type 头信息将被忽略。
有效的数据类型是 text, html, xml, json,jsonp,和 script
dataType:预期服务器返回的数据类型。如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息来智能判断,比如 XML MIME 类型就被识别为 XML。在1.4中,JSON 就会生成一个 JavaScript 对象,而 script 则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后,传递给回调函数。
script 类型
$.ajax({ type : "GET", url : "test.js", dataType : "script", complete: function(jqXHR, status) { console.log(jqXHR, status) } });
根据 API 的说明可知,如果 dataType 类型为 script 的时候,需要处理。
针对上述四点,我们看看处理的流程。
inspectPrefiltersOrTransports(prefilters,s,options,jqXHR)
此时的 dataType 类型就会经过对应的预处理 ajaxPrefilter("script"),其中 s.cache (默认: true, dataType 为 "script" 和 "jsonp" 时默认为 false)。
jQuery.ajaxPrefilter("script", function(s) { if (s.cache === undefined) { s.cache = false; } if (s.crossDomain) { s.type = "GET"; } });
预处理的处理就是将其缓存为设置为 false ,浏览器将不缓存此页面,这将在请求的 URL 的查询字符串中追加一个时间戳参数,以确保每次浏览器下载的脚本被重新请求,工作原理是在 GET 请求参数中附加" _={timestamp} "在请求的地址后面加一个时间戳。
if (s.cache === false) { s.url = rts.test(cacheURL) ? // If there is already a '_' parameter, set its value cacheURL.replace(rts, "$1_=" + ajax_nonce++) : // Otherwise add one to the end cacheURL + (ajax_rquery.test(cacheURL) ? "&" : "?") + "_=" + ajax_nonce++; }
此时的 s.url = "test.js?_=1402362401890",该参数不是其他请求所必须的,除了在 IE8 中,当一个 POST 请求一个已经用 GET 请求过的 URL。
我们可以参考下右边的简单的调试。
<!doctype html> <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8"/> <script src="http://code.jquery.com/jquery-latest.js"></script> <title></title> </head> <body> script的预处理结果 <ul></ul> <script type="text/javascript"> var $ul = $('ul') function show(data) { $ul.append('<li>' + data + '</li>'); } /////////////////// // script 类型的预处理 // // // jQuery.ajaxPrefilter("script", function(s) { // if (s.cache === undefined) { // s.cache = false; // } // if (s.crossDomain) { // s.type = "GET"; // } // }); /////////////////// jQuery.ajaxPrefilter("script", function(s) { show('s.cache:' + s.cache) show('s.type:' + s.type) }); //执行一个异步的HTTP(Ajax)的请求。 var ajax = $.ajax({ url: 'http://code.jquery.com/jquery-latest.js', dataType: 'script', beforeSend:function(jqXHR, s){ show('s.url:' + s.url) } }) </script> </body> </html>