$.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. 使用cmd命令导入SQL文件

    1 . 进入SQL安装目录下的bin目录,比如我的是在 C:\Program Files\MySQL\MySQL Server 5.5\bin目录下 2. 开始 --->运行--->输入c ...

  2. logging-----日志模块

    import logging #creat logger 第一步,创建一个记录器 logging_name = 'test' logger = logging.getLogger(logging_na ...

  3. MySQL自增列锁模式 innodb_autoinc_lock_mode不同参数下性能测试

    对于innodb_autoinc_lock_mode 各种参数的值的含义,网上也有各种详解,看完觉得意犹未尽,这里不做阐述,只动手测试,看看性能上,到底有没有理论上所说的差别.对于自增列的锁定,据说是 ...

  4. Interlij idea

    https://blog.csdn.net/qq_30180559/article/details/79146795 http://baijiahao.baidu.com/s?id=157736618 ...

  5. webpack 4.0配置2

    上个博客记录了webpack 的基本配置今天主要是css-loader的介绍,包括单独提出css,压缩css.js文件 这里使用的插件npm 地址:https://www.npmjs.com/pack ...

  6. python 写入数据

    import sys reload(sys) sys.setdefaultencoding('utf8') import xlrd import xlwt book = xlrd.open_workb ...

  7. 从零开始学spring cloud(十) -------- hystrix简单代码示例

    一.官网文档阅读 较低级别的服务中的服务故障可能导致级联故障一直到用户. 当对特定服务的调用超过circuitBreaker.requestVolumeThreshold(默认值:20个请求)且失败百 ...

  8. Spring MVC相关

    配置文件说明 web.xml, spring配置文件 applicationContext.xml, spring配置文件, mybatis连接mysql配置文件 sql-map-config-mys ...

  9. python_appium_模拟器启动app进行登录

    #coding=utf-8from appium import webdriverimport timedesired_caps = {} #列表desired_caps['platformName' ...

  10. 欢迎来到Python世界

    Python是一门优雅而健壮的解释型编程语言,它具有如下的特点: 易学  Python关键字少.结构简单.语法清晰.学习者可以在相对更短的时间内轻松上手. 易读  Python没有其它语言通常用来访问 ...