zepto 源码 $.contains 学习笔记
- $.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>
- <!DOCTYPE html>
zepto 源码 $.contains 学习笔记的更多相关文章
- Johnson 全源最短路径算法学习笔记
Johnson 全源最短路径算法学习笔记 如果你希望得到带互动的极简文字体验,请点这里 我们来学习johnson Johnson 算法是一种在边加权有向图中找到所有顶点对之间最短路径的方法.它允许一些 ...
- zepto源码--init--学习笔记
先展示init函数,由于笔记本屏幕太小,删掉了部分源码注释,才能在一屏内截图. 当我们调用$()的时候,便会直接调用zepto.init()生成zepto对象,跟jquery生成jquery对象类似. ...
- 试试看读一下Zepto源码
在浏览器上(Safari.Chrome和Firefox)上开发页面应用或者构建基于html的web-view本地应用,你如PhoneGap,使用Zepto是一个不错的选择. Jquery和Zepto的 ...
- Zepto源码
// Zepto.js // (c) 2010-2016 Thomas Fuchs // Zepto.js may be freely distributed under the MIT licens ...
- zepto源码--qsa--学习笔记
zepto内部选择器qsa方法的实现. 简述实现原理: 通过判断传入的参数类型: 如果是'#id',则使用getElementById(id)来获取元素,并且将结果包装成数组形式: 如果是'.clas ...
- zepto源码--extend--学习笔记
对象继承函数: $.extend(){},默认传递一个参数,需要继承的对象目标.函数展示: 最终实现的过程,需要调用工具函数extend,首先分析extend函数. 默认传递三个参数,继承的目标对象- ...
- zepto源码--fragment--学习笔记
文档片段fragment函数默认传递三个参数: html文档片段字符串 name标签 properties额外添加的属性 函数内部实现过程: var dom, nodes, container; 中间 ...
- zepto源码--matches--学习笔记
zepto的第一个函数,zepto.matches: 作用:用来匹配dom元素是否匹配某css selector. 它为后面的一些高级方法的实现提供了基础支持,比如事件代理,parent, close ...
- c++ stl源码剖析学习笔记(一)uninitialized_copy()函数
template <class InputIterator, class ForwardIterator>inline ForwardIterator uninitialized_copy ...
随机推荐
- UVa514 Rails (栈)
题意:一列有n节车厢的火车按顺序进站,给你一个出站顺序,问你该火车的车厢能否以该顺序出站? 分析:出站的车厢满足后进先出的关系,所以我们考虑采用栈s 假设车厢一共有n节,n = 5: 进站顺序A:1 ...
- Scratch 数字游戏
本想用Scratch给女儿做一个类似舒尔特方格的程序来认识数字和提升专注,想想这对刚刚3岁的孩子来说还是比较困难的,于是只做了3*3的方格,来认识数字1-9. 游戏地址:Random 9 v0.21 ...
- Spring再接触 Annotation part1
使用annotation首先得加这两条代码 beans.xml <?xml version="1.0" encoding="UTF-8"?> < ...
- 64位的windows服务安装问题
需要使用64位的安装exe文件才可以. @echo offC:\Windows\Microsoft.NET\Framework64\v4.0.30319\InstallUtil.exe -i &quo ...
- c++ protected 访问限定
class A { protected: int mA; }; class B : public A{ public: void Func() { mA = 0; // ok A *a = this; ...
- 浅谈openstack中使用linux_bridge实现vxlan网络
openstack环境: 1 版本:ocata 2 系统:ubuntu16.04.2 3 控制节点 1个 + 计算节点 1个 4 控制节点网卡为ens33,ip = 172.171.5.200 ens ...
- python day11 函数(第三篇)
2019.4.11 S21 day11笔记总结 1. 函数小高级 ( 5* ) 1 函数名可以当作变量来使用 def func(): print(123) v1 = func # func代表函数的地 ...
- JAVA WEN开发环境与搭建
一.下载安装JDK1.配置jdk开发环境JAVA_HOME 2.path 二.下载安装eclipse javaEE版本 三.安装部署tomcat3.1.安装: 直接解压到指定目录即可.(注:目录不要太 ...
- 冒泡排序 & 选择排序(升序)
软件工程上老师讲流程图时,要求画冒泡排序和选择排序的流程图--------问题来了,故想基于百度两种排序后,自我总结的写些什么 请将一维数组a[n] 里面的 n个元素 升序排好 ---------- ...
- python标准库之operator(运算符模块)
operator模块提供了一系列与Python自带操作一样有效的函数.例如:operator.add(x, y)和表达式x+y是等效的.那些特殊类的方法都有自己的函数名:为了方便起见,一些函数名是没有 ...