Node.contains

最新推荐文章于 2022-10-22 12:36:14 发布

iteye_14264

最新推荐文章于 2022-10-22 12:36:14 发布

阅读量194

点赞数

分类专栏： dom javascript

本文链接：https://blog.csdn.net/iteye_14264/article/details/82237625

版权

javascript 同时被 2 个专栏收录

17 篇文章 0 订阅

订阅专栏

dom

2 篇文章 0 订阅

订阅专栏


/*
 code ref  http://www.cnblogs.com/rubylouvre/archive/2009/10/14/1583523.html
 IE有contains方法。如果A元素包含B元素，则返回true，否则false。唯一不支持这个方法的是firefox。
 不过火狐支持compareDocumentPosition() 方法，这是W3C制定的方法，标准浏览器都支持。
 它的使用形式与contains差不多，但返回的不是一个布尔值，而是一个很奇怪的数值，它是通过如下方式累加计算出来的：
 二进制  	数值 含义
 000000	0	   元素一致
 000001	1	   节点在不同的文档（或者一个在文档之外）
 000010	2	   节点 B 在节点 A 之前
 000100	4	   节点 A 在节点 B 之前
 001000	8	   节点 B 包含节点 A
 010000	16   节点 A 包含节点 B
 100000	32    浏览器的私有使用
 A.compareDocumentPosition(B);//B与A不相连，B在A的后面，B被A包含 4+16 = 20
 B.compareDocumentPosition(A);//A与B不相连，A在B的前面，A包含B 2+8 = 10
 */
//PPK给出如下解决方法。
if (window.Node && Node.prototype && !Node.prototype.contains) {
    Node.prototype.contains = function (arg) {
        return !!(this.compareDocumentPosition(arg) & 16);//位运算 小于16结果为0
    }
} 
//2011.9.24 by 司徒正美
var contains = function(root, el) {
    if (root.compareDocumentPosition)
        return root === el || !!(root.compareDocumentPosition(el) & 16);
    if (root.contains && el.nodeType === 1) {
        return root.contains(el) && root !== el;
    }
    //两种原生方法都不支持的话 -_-||| 递归吧
    while ((el = el.parentNode))
        if (el === root) return true;
    return false;
}