$.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. Never Wait for Weights（带权并查集+路径压缩）

    题目链接:http://acm.sdibt.edu.cn/vjudge/contest/view.action?cid=2209#problem/F !a b w 表示b比a大w ?  a b  输出 ...

  2. 关于 登录框的测试的一些case

    ---恢复内容开始--- 最近的一个task是需要测试一个登录的界面,我的产品是应用程序,不是网页,所以,测试起来,会相对简单一些 还是按照 质量模型的角度,来思考这个 页面的测试 Requireme ...

  3. 1.express中间件的简介

    express中间件的意思 1, 中间件是一个模块.在js中,模块意味着函数,所以中间件是一个函数.那么这个函数长什么样子? 这还要从中间件的功能说起,它拦截http 服务器提供的请求和响应对象,执行 ...

  4. iOS10以下版本不支持swiper

    解决办法,降低swiper4*版本引用低版本如3.4.2可以兼容iOS8,

  5. Java Web解决跨域请求

    要知道跨域请求就要先了解同源策略,那么什么是同源?什么是不同源?简单来说就是,如果两个资源,包括HTML页面.JavaScript脚本.css样式,对应的协议.域名和端口完全相同,那么这两个资源就是同 ...

  6. iframe登录超时跳转登录页面

    1.可以在登录页面加jQuery验证 $(function () { //判断一下当前是不是做顶层,如果不是,则做一下顶层页面重定向 if (window != top) { top.location ...

  7. pwnable.kr-bof-witeup

    根据原程序可知,输入overflowme变量覆盖key变量即可,所以接下来应该看俩变量的距离,从而构造覆盖的payload. 嗯,他们相差了52个地址,overflowme变量在低地址,存放函数的栈中 ...

  8. SQLServer 主键、外键、唯一等约束

    主键(primary key)约束.外键(foreign key)约束.唯一(unique)约束.检查(check)约束.默认值(default)约束实例 Oracle 有如下类型的约束:NOT NU ...

  9. 转*SqlSever查询某个表的列名称、说明、备注、注释，类型等

    @原文地址 关键部分如下: ------sqlserver 查询某个表的列名称.说明.备注.类型等 SELECT 表名 then d.name else '' end, 表说明 then isnull ...

  10. Spring Boot HikariCP 一 ——集成多数据源

    其实这里介绍的东西主要是参考的另外一篇文章,数据库读写分离的. 参考文章就把链接贴出来,里面有那位的代码,简单明了https://gitee.com/comven/dynamic-datasource ...