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>
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 ...
随机推荐
- golang基于etcd实现分布式锁（转）
下面描述使用 Etcd 实现分布式锁的业务流程,假设对某个共享资源设置的锁名为:/lock/mylock 步骤 1: 准备 客户端连接 Etcd,以 /lock/mylock 为前缀创建全局唯一的 k ...
- C语言语法
1.函数指针类型定义,然后指针结构体类型定义,最后的调用形式为aaa.bbb();(aaa为结构体变量)或者 aaa->bbb();(aaa为结构体指针),函数指针最好用结构体封装起来变成指针结 ...
- vscode垂直选中列选中
VSCode列选择快捷键:Alt+Shift+左键
- 吴裕雄 python深度学习与实践（18）
# coding: utf-8 import time import numpy as np import tensorflow as tf import _pickle as pickle impo ...
- Django中的auth模块
from django.contrib import auth authenticate() 提供了用户认证功能,即验证用户名以及密码是否正确,一般需要username .password两个关键字参 ...
- v8:: fatalProcessOutOfMemory
express项目,用于画图读写图片数据, pm2 作为进城守护. 生产环节报警:v8:: fatalProcessOutOfMemory,xxxx等,一时不知道什么原因. linux系统下使用如下命 ...
- react组件开发规范总结
开发react也有一段时间了,一开始的随手写,生命周期乱用,无状态组件的不熟悉.现在逐渐规范一下,从网上各个地方copy过来,整理出一份文档.可能不全,后续还得多提炼总结和完善. 一.组件内方法书写, ...
- C#客户端和服务端数据的同步传输 （转载）
客户端: using System;using System.Collections.Generic;using System.ComponentModel;using System.Data;u ...
- 小强学渲染之Unity Shader编程HelloWorld
第一个简单的顶点vert/片元frag着色器 1)打开Unity 5.6编辑器,新建一个场景后ctrl+s保存命名为Scene_5.默认创建的场景是包含了一摄像机,一平行光,且场景背景是一天空盒而 ...
- FPGA驱动步进电机
步进电机 步进电机是将电脉冲信号转变为角位移或线位移的开环控制电机,是现代数字程序控制系统中的主要执行元件,应用极为广泛.在非超载的情况下,电机的转速.停止的位置只取决于脉冲信号的频率和脉冲数,而不受 ...