jQuery 2.1.4版本的源码分析

jquery中获取元素的源码分析

jQuery.each({
// 获取当前元素的父级元素
parent: function(elem) {
var parent = elem.parentNode;
//nodeType为11的节点类型是DocumentFragment
return parent && parent.nodeType !== 11 ? parent : null;
},
//获取所有的 父节点 这涉及到 dir 方法
parents: function(elem) {
return jQuery.dir(elem, "parentNode");
},
parentsUntil: function(elem, i, until) {
return jQuery.dir(elem, "parentNode", until);
},
next: function(elem) {
return sibling(elem, "nextSibling");
},
prev: function(elem) {
return sibling(elem, "previousSibling");
},
nextAll: function(elem) {
return jQuery.dir(elem, "nextSibling");
},
prevAll: function(elem) {
return jQuery.dir(elem, "previousSibling");
},
nextUntil: function(elem, i, until) {
return jQuery.dir(elem, "nextSibling", until);
},
prevUntil: function(elem, i, until) {
return jQuery.dir(elem, "previousSibling", until);
},
     //返回所有的兄弟节点
siblings: function(elem) {
return jQuery.sibling((elem.parentNode || {}).firstChild, elem);
},
children: function(elem) {
return jQuery.sibling(elem.firstChild);
},
    //返回框架里面的所有内容 或者 元素的所有子节点
contents: function(elem) {
return elem.contentDocument || jQuery.merge([], elem.childNodes);
}
}, function(name, fn) {
jQuery.fn[name] = function(until, selector) {
var matched = jQuery.map(this, fn, until); if(name.slice(-5) !== "Until") {
selector = until;
} if(selector && typeof selector === "string") {
matched = jQuery.filter(selector, matched);
} if(this.length > 1) {
// Remove duplicates
if(!guaranteedUnique[name]) {
jQuery.unique(matched);
} // Reverse order for parents* and prev-derivatives
if(rparentsprev.test(name)) {
matched.reverse();
}
} return this.pushStack(matched);
};
});
jQuery.extend({
// 寻找父级 直到 找到until结束 根据parents 方法可知 dir = parentNode
dir: function(elem, dir, until) {
var matched = [],
truncate = until !== undefined;
        //进入循环的条件 不是根节点 且 且吧父节点复制给elem
while((elem = elem[dir]) && elem.nodeType !== 9) {
if(elem.nodeType === 1) {
            //跳出循环
if(truncate && jQuery(elem).is(until)) {
break;
}
matched.push(elem);
}
}
return matched;
},
         //通过上面的源码next方法可知 elem = nextSiblilng
sibling: function(n, elem) {
var matched = []; for(; n; n = n.nextSibling) {
if(n.nodeType === 1 && n !== elem) {
matched.push(n);
}
} return matched;
}
});

这里说一下 nextSibling 与 nextElementSibling的区别

nextSibling :返回元素之后的兄弟节点 (包含 注释 文本)

nextElementSibling:返回元素之后的兄弟节点 不包括注释 跟文本 且他的属性只为读

jQuery.noConflict源码分析

var
// 将JQuery挂载到Windows对象下
_jQuery = window.jQuery, // 将$挂载到Windows对象下
_$ = window.$;
// 当调用 Jquery.noConfict deep ==false 那么 $ 别名失效 如果 deep==true 那么 JQuery 的别名失效
jQuery.noConflict = function(deep) {
if(window.$ === jQuery) {
window.$ = _$;
} if(deep && window.jQuery === jQuery) {
window.jQuery = _jQuery;
} return jQuery;
}; // Expose jQuery and $ identifiers, even in AMD
// (#7102#comment:10, https://github.com/jquery/jquery/pull/557)
// and CommonJS for browser emulators (#13566)
if(typeof noGlobal === strundefined) {
window.jQuery = window.$ = jQuery;

2016-11-22   21:14:38

jQuery 2.1.4版本的源码分析的更多相关文章

  1. jQuery实现DOM加载方法源码分析

    传统的判断dom加载的方法 使用 dom0级 onload事件来进行触发所有浏览器都支持在最初是很流行的写法 我们都熟悉这种写法: window.onload=function(){ ... }  但 ...

  2. jQuery deferred应用之ajax详细源码分析(二)

    在上一节中,我只贴出了$.Deferred的源码分析,并没用讲解怎么使用它,现在我们先看看$.ajax是如何使用它,让我们进行异步任务的处理. 如果没看上节的代码,请先稍微了解一下jQuery Def ...

  3. jQuery().end()的内部实现及源码分析

    jQuery().end()的作用是返回当前jQuery对象的上一个状态. 1.end()源码: // 所有通过pushStack方法获得的jQuery对象都可以通过end方法返回之前的状态   // ...

  4. jQuery-1.9.1源码分析系列(十六)ajax——响应数据处理和api整理

    ajax在得到请求响应后主要会做两个处理:获取响应数据和使用类型转化器转化数据 a.获取响应数据 获取响应数据是调用ajaxHandleResponses函数来处理. ajaxHandleRespon ...

  5. angular源码分析:injector.js文件分析——angular中的依赖注入式如何实现的(续)

    昨天晚上写完angular源码分析:angular中jqLite的实现--你可以丢掉jQuery了,给今天定了一个题angular源码分析:injector.js文件,以及angular的加载流程,但 ...

  6. jQuery1.9.1源码分析--数据缓存Data模块

    jQuery1.9.1源码分析--数据缓存Data模块 阅读目录 jQuery API中Data的基本使用方法介绍 jQuery.acceptData(elem)源码分析 jQuery.data(el ...

  7. JDK源码分析(6)ConcurrentHashMap

    JDK版本 ConcurrentHashMap源码分析 table:默认为null,初始化发生在第一次插入操作,默认大小为16的数组,用来存储Node节点数据,扩容时大小总是2的幂次方. nextTa ...

  8. JDK1.8源码分析03之idea搭建源码阅读环境

    序言:上一节说了阅读源码的顺序,有了一个大体的方向,咱们就知道该如何下手.接下来,就要搭建一个方便阅读源码及debug的环境.有助于跟踪源码的调用情况. 目前新开发的项目, 大多数都是基于JDK1.8 ...

  9. drf源码分析系列---版本控制

    版本的使用 第一步:写路由url(r'^api/(P<version>\w+)/user/$',views.UserView.as_view()), 第二步:写模块导入from rest_ ...

随机推荐

  1. 剑指offer-第六章面试中的各项能力(翻转单词的顺序VS左旋转字符串)

    //题目1:翻转单词顺序例如“Hello world!”翻转后为world! Hello. //思路:首先翻转整个字符串,然后再分别翻转每个单词. //题目2:左旋转字符串,是将字符串的前面几个(n) ...

  2. phpstorm2017.3.6的激活、样式设置和汉化

    一:安装phpstorm2017.3.6,并激活.设置样式.(1)先在phstorm官网里www.jetbrains.com下载phpstorm2017.3.6,按照步骤安装即可.下面开始激活!(2) ...

  3. elasticsearch 动态模板

    在elasticsearch中,如果你有一类相似的数据字段,想要统一设置其映射,就可以用到一项功能:动态模板映射(dynamic_templates). 每个模板都有一个名字用于描述这个模板的用途,一 ...

  4. openfaas 安装(docker swarm 模式)

     备注:为了简单使用的是docker-compose 进行组件的安装  预备环境:    docker  (配置好 swarm  集群模式)  docker-compose     1. docker ...

  5. 【openCV学习笔记】【1】如何载入一张图片

    直接看代码好了 #include <iostream> #include <opencv/highgui.h>//这里主要用到窗口显示 int main(int argc, c ...

  6. linux文件系统命令和分区 挂载

    文件系统命令df [选项][挂载点]选项:-a 显示所有的文件系统信息,包括特殊文件,如/proc,/sysfs-h 使用习惯单位显示容量,如KB,MB或GB等-T 显示文件系统类型-m 以MB为单位 ...

  7. 使用Visual Studio开发跨平台的iOS应用程序

    [原文发表地址]Developing cross-platform iOS application using Visual Studio [原文发表时间]2015/6/4 C ++是一种流行的高级编 ...

  8. PhantomJS 一个隐形的浏览器

    下载地址: http://phantomjs.org/download.html 使用方法: 下载压缩包解压出来找到phantomjs.exe 放到python的根目录下

  9. python开发mysql:表关系&单表简单查询

    一 一对多,多对一 1.1 建立多对一 ,一对多的关系需要注意 先建立被关联的表,被关联的字段必须保证时唯一的 在创建关联的表,关联的字段一定是可以重复的 1.2 示例: 出版社 多对一,多个老师可能 ...

  10. 配置VMware中的Ubuntu能够被其他机器ssh远程

    配置虚拟机Ubuntu能够被其他机器 ssh远程 将虚拟机Ubuntu改成桥接模式 在Ubuntu中安装openssh sudo apt install openssh-server -y sudo ...