$.contains(parent,node)  返回值为一个布尔值 ==> boolean 
parent,node我们需要检查的节点
检查父节点是否包含给定的dom节点,如果两者是相同的节点,返回 false。
zepto代码实现方式:
$.contains = document.documentElement.contains ?
function(parent, node) {
return parent !== node && parent.contains(node)
} :
function(parent, node) {
while (node && (node = node.parentNode))
if (node === parent) return true
return false
}

扩展:Node.contains() 返回的是一个布尔值,来表示传入的节点是否为该节点的后代节点。

应用:node.contains( otherNode )   
如果 otherNode 是 node 的后代节点或是 node 节点本身.则返回true , 否则返回 false.

  • node是否包含otherNode节点.
  • otherNode为node节点的后代节点
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8" />
    <title></title>
    <!-- <script src="js/zepto.js"></script> -->
    </head>
    <body>
    <div id="div"></div>
    <div id="parent">
    <p id="p">p元素</p>
    <div id="child">div元素</div>
    </div>
    </body>
    <script>
    var oParent = document.getElementById('parent');
    var oP = document.getElementById('p');
    var oChild = document.getElementById('child');
    var oDiv = document.getElementById('div');
    var oBody = document.getElementsByTagName('body')[0];
    console.log(oParent.contains(oParent))// true
    console.log(oParent.contains(oChild))// false
    console.log(oParent.contains(oDiv))// false
    </script>
    </html>

源码地址

zepto 源码 $.contains 学习笔记的更多相关文章

  1. Johnson 全源最短路径算法学习笔记

    Johnson 全源最短路径算法学习笔记 如果你希望得到带互动的极简文字体验,请点这里 我们来学习johnson Johnson 算法是一种在边加权有向图中找到所有顶点对之间最短路径的方法.它允许一些 ...

  2. zepto源码--init--学习笔记

    先展示init函数,由于笔记本屏幕太小,删掉了部分源码注释,才能在一屏内截图. 当我们调用$()的时候,便会直接调用zepto.init()生成zepto对象,跟jquery生成jquery对象类似. ...

  3. 试试看读一下Zepto源码

    在浏览器上(Safari.Chrome和Firefox)上开发页面应用或者构建基于html的web-view本地应用,你如PhoneGap,使用Zepto是一个不错的选择. Jquery和Zepto的 ...

  4. Zepto源码

    // Zepto.js // (c) 2010-2016 Thomas Fuchs // Zepto.js may be freely distributed under the MIT licens ...

  5. zepto源码--qsa--学习笔记

    zepto内部选择器qsa方法的实现. 简述实现原理: 通过判断传入的参数类型: 如果是'#id',则使用getElementById(id)来获取元素,并且将结果包装成数组形式: 如果是'.clas ...

  6. zepto源码--extend--学习笔记

    对象继承函数: $.extend(){},默认传递一个参数,需要继承的对象目标.函数展示: 最终实现的过程,需要调用工具函数extend,首先分析extend函数. 默认传递三个参数,继承的目标对象- ...

  7. zepto源码--fragment--学习笔记

    文档片段fragment函数默认传递三个参数: html文档片段字符串 name标签 properties额外添加的属性 函数内部实现过程: var dom, nodes, container; 中间 ...

  8. zepto源码--matches--学习笔记

    zepto的第一个函数,zepto.matches: 作用:用来匹配dom元素是否匹配某css selector. 它为后面的一些高级方法的实现提供了基础支持,比如事件代理,parent, close ...

  9. c++ stl源码剖析学习笔记(一)uninitialized_copy()函数

    template <class InputIterator, class ForwardIterator>inline ForwardIterator uninitialized_copy ...

随机推荐

  1. Python3 多线程、多进程

    python中的线程是假线程,不同线程之间的切换是需要耗费资源的,因为需要存储线程的上下文,不断的切换就会耗费资源.. python多线程适合io操作密集型的任务(如socket server 网络并 ...

  2. 初探LaTeX

    第一次使用LaTeX 步骤  1 安装LaTeX 通过官网http://www.tug.org/mactex/mactex-download.html下载Mac版LaTeX. 安装成功后会出现 步骤 ...

  3. java学习--自定义类的实例的大小比较和排序

    我们知道Object类有一个equals方法,用于比较两个对象是否相等 我们只要在自定义类中重写了equals方法(若不重写就是比较两个实例的地址,相当于==)就可以用来比较该类的两个实例是否相等 问 ...

  4. Ruby on Rails 开发笔记

    安装 Ruby on Rails Install Rails: A step-by-step guide 创建应用 # 创建新的应用程序 $ rails new blog $ cd blog # 启动 ...

  5. pyqgis学习

    1. 错误:ImportError: No module named qgis.core解决方法:python的qgis,初始化变量:D:\PROGRA~1\QGIS3~1.0\OSGeo4W.bat ...

  6. android手机旋转方向识别

    private OrientationEventListener mOrientationListener; private String TAG = "MainActivity" ...

  7. 如何使用tensorboard查看tensorflow  graph****.pb文件的模型结构

    参考网上的:https://github.com/tensorflow/tensorflow/issues/8854 import tensorflow as tf from tensorflow.p ...

  8. cpu资源长期使用率过高导致系统内核锁问题

    服务器跑大量高负载程序,会造成cpu soft lockup. 解决办法: #追加到配置文件中 echo 30 > /proc/sys/kernel/watchdog_thresh #查看 [r ...

  9. Java框架spring 学习笔记(十一):aop相关概念

    为什么要引入aop? 比如如下情景: 在父类的方法名称发送了变化,在子类调用的方法也需要变化,当工程规模越来越大的时候,维护起来相当不方便,于是就引入了横向切面aop. aop的相关概念: 连接点:类 ...

  10. pycharm 配置svn

    1.找到本地svn.exe 2.配置svn路径 3.输入svn路径,然后会进行密码校验 问题 本地的TortoiseSVN在bin目录没有发现svn.exe 原因: 安装TortoiseSVN的时候 ...