关于jQuery的ajax的源码的dataType解读
$.ajax其实底层还是用的XMLHttpRequest,对于加载数据的格式datatype有:xml、text、html、json、jsonp、script。
其中xml、text不需要处理,直接使用原生的responseXML、responseText。对于html、json其实也是用responseText接收的,对于json格式,jquery拿到responseText后会预先用JSON.parse()去格式化一下json数据再传给回调函数。
对于jsonp和script的,其实不走xhr对象,直接使用script标签。但是在使用datatype=script之前,jquery还是做了判断,只有跨域请求才会走<script>标签。
具体判断如下:
s.crossDomain = !!( parts &&
( parts[ 1 ] !== ajaxLocParts[ 1 ] || parts[ 2 ] !== ajaxLocParts[ 2 ] ||
( parts[ 3 ] || ( parts[ 1 ] === "http:" ? "80" : "443" ) ) !==
( ajaxLocParts[ 3 ] || ( ajaxLocParts[ 1 ] === "http:" ? "80" : "443" ) ) )
);
此处代码会判断(请求的url===location.href)。如果不等于,相当于跨域,jquery会主动判断为跨域请求,使用script标签进行处理。如下代码:
jQuery.ajaxTransport( "script", function( s ) {
// This transport only deals with cross domain requests
if ( s.crossDomain ) {//jquery判断是否跨域,跨域才会添加script标签
var script,
head = document.head || jQuery( "head" )[ 0 ] || document.documentElement;
return {
send: function( _, callback ) {
script = document.createElement( "script" );
script.async = true;
if ( s.scriptCharset ) {
script.charset = s.scriptCharset;
}
script.src = s.url;
// Attach handlers for all browsers
script.onload = script.onreadystatechange = function( _, isAbort ) {
if ( isAbort || !script.readyState || /loaded|complete/.test( script.readyState ) ) {
// Handle memory leak in IE
script.onload = script.onreadystatechange = null;
// Remove the script
if ( script.parentNode ) {
script.parentNode.removeChild( script );
}
// Dereference the script
script = null;
// Callback if not abort
if ( !isAbort ) {
callback( 200, "success" );
}
}
};
// Circumvent IE6 bugs with base elements (#2709 and #4378) by prepending
// Use native DOM manipulation to avoid our domManip AJAX trickery
head.insertBefore( script, head.firstChild );
},
abort: function() {
if ( script ) {
script.onload( undefined, true );
}
}
};
}
} );
同时在请求之前,jquery还做了一些事情。
header里写了:
X-Requested-With = "XMLHttpRequest";
If-Modified-Since = url;
Content-Type = application/x-www-form-urlencoded; 这个是让ajax提交模拟form表单提交的数据,从浏览器端看到的是如下:BYT.png)
BYT.png)
BYT.png)
关于jQuery的ajax的源码的dataType解读的更多相关文章
- 在网站开发中很有用的8个 jQuery 效果【附源码】
jQuery 作为最优秀 JavaScript 库之一,改变了很多人编写 JavaScript 的方式.它简化了 HTML 文档遍历,事件处理,动画和 Ajax 交互,而且有成千上万的成熟 jQuer ...
- 分享一组很赞的 jQuery 特效【附源码下载】
作为最优秀的 JavaScript 库之一,jQuery 不仅使用简单灵活,同时还有许多成熟的插件可供选择,它可以帮助你在项目中加入漂亮的效果.这篇文章挑选了8个优秀的 jQuery 实例教程,这些 ...
- jQuery 2.0.3 源码分析core - 选择器
声明:本文为原创文章,如需转载,请注明来源并保留原文链接Aaron,谢谢! 打开jQuery源码,一眼看去到处都充斥着正则表达式,jQuery框架的基础就是查询了,查询文档元素对象 ...
- AJAX JSONP源码实现(原理解析)
关于JSONP以及跨域问题,请自行搜索. 本文重点给出AJAX JSONP的模拟实现代码,代码中JSONP的基本原理也一目了然. <html xmlns="http://www.w3. ...
- 14款让前端开发者心动的jQuery/CSS3插件及源码
14款让前端开发者心动的jQuery/CSS3插件及源码,一起来看看. 1.jQuery左右滚动banner代码! DEMO演示 / 源码下载 2.jQuery QQ表情插件qqFace ...
- 第二十五课:jQuery.event.trigger的源码解读
本课主要来讲解jQuery.event.trigger的源码解读. trigger = function(event, data, elem, onlyHandlers){ if(elem & ...
- jQuery 2.0.3 源码分析Sizzle引擎解析原理
jQuery 2.0.3 源码分析Sizzle引擎 - 解析原理 声明:本文为原创文章,如需转载,请注明来源并保留原文链接Aaron,谢谢! 先来回答博友的提问: 如何解析 div > p + ...
- 基于jQuery经典扫雷游戏源码
分享一款基于jQuery经典扫雷游戏源码.这是一款网页版扫雷小游戏特效代码下载.效果图如下: 在线预览 源码下载 实现的代码. html代码: <center> <h1>j ...
- jquery $.proxy使用 Jquery实现ready()的源码
jquery $.proxy使用 在某些情况下,我们调用Javascript函数时候,this指针并不一定是我们所期望的那个.例如: 1 //正常的this使用 2 $('#myElement') ...
随机推荐
- Ruby中,&:(ampersand colon)的用法
前几日看Ruby代码,发现一个奇怪的用法,如下: a=['a', 'b', 'c'].map! &:upcase p a #["A", "B", &qu ...
- react-native 环境配置及hello world
一.前言 最近手头的工作繁多,有研究性的项目和系统研发,正好遇到同事离职,接手了框架的UI组件,不仅需要维护和填坑,还需要开发新的功能组件.因为身在H5-Hybird的框架部门,最近团队开始尝试使用R ...
- linux查看用户登录信息2-who命令
who命令与w命令相似,但要比w命令显示更加详细的信息.[root@rusky opt]# man who WHO(1) User Commands WHO(1) NAME who - show wh ...
- 使用秘钥对登录Linux系统
一,用密码登录系统,可能由于密码的简单或者其他原因造成被其他人登录,这样服务器可是很不安全的,为此我们可以使用秘钥登录系统. 二, 1,设置密钥对前,我们需要下载一个工具 https://the.ea ...
- PHP中的的一个挺好用的函数 array_chunk
- sql 随机数
select FLOOR(rand()*16) 就是随机得到0到15之间的一个整数 select CEILING(rand()*15) 就是随机得到1到15之间的一个整数 FLOOR()为地板函数,取 ...
- Spring Annotation注解进行aop的学习
使用Maven管理项目,pom文件为: <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi=" ...
- Qt 五子棋
http://blog.csdn.net/baiding1123/article/details/17194535
- MVC模式下如何对多选框数据进行增删改查
一.业务情景: 做的是一个项目管理的增删改查模块,一个项目里面有项目成员属性,而且一个项目可以有多个成员,一个成员可以参加多个项目,多对多关系,数据库表里自然要建立一个关系表. 视图 二.视 ...
- JavaScript 字符串常用操作纪要
JavaScript 字符串用于存储和处理文本.因此在编写 JS 代码之时她总如影随形,在你处理用户的输入数据的时候,在读取或设置 DOM 对象的属性时,在操作 Cookie 时,在转换各种不同 Da ...