zepto 源码 $.contains 学习笔记

最新推荐文章于 2024-04-27 05:57:08 发布

weixin_30701575

最新推荐文章于 2024-04-27 05:57:08 发布

阅读量110

点赞数

原文链接：http://www.cnblogs.com/FishStudy520/p/10748427.html

版权

$.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>

源码地址

转载于:https://www.cnblogs.com/FishStudy520/p/10748427.html

weixin_30701575

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
zepto 源码 $.contains 学习笔记

$.contains(parent,node) 返回值为一个布尔值 ==> boolean parent,node我们需要检查的节点检查父节点是否包含给定的dom节点，如果两者是相同的节点，返回 false。zepto代码实现方式：$.contains = document.documentElement.contains ? function(parent, node)...
复制链接

扫一扫