阅读jquery源码问题记录(二)

 contains = rnative.test(docElem.contains) || docElem.compareDocumentPosition ?
                function(a, b) {
                    var adown = a.nodeType === 9 ? a.documentElement : a,
                        bup = b && b.parentNode;
                    return a === bup || !! (bup && bup.nodeType === 1 && (
                        adown.contains ?//节点是否有contains函数
                        adown.contains(bup) :
                        a.compareDocumentPosition && a.compareDocumentPosition(bup) & 16//是否存在compareDocumentPosition,a是否包含bup
                    ));
            } :
                function(a, b) {
                    if (b) {
                        while ((b = b.parentNode)) {//判断b是否是a的子孙节点
                            if (b === a) {
                                return true;
                            }
                        }
                    }
                    return false;
            };

1、DOMElement.contains(DOMNode)

这个方法起先用在 IE ,用来确定 DOM Node 是否包含在另一个 DOM Element 中。

当尝试优化 CSS 选择器遍历(像:“#id1 #id2”),这个方法很有用。你可以通过 getElementById 得到元素,然后使用 .contains() 确定 #id1 实际上是否包含 #id2。

注意:如果 DOMNode 和 DOMElement 相一致,.contains() 将返回 true ,虽然,一个元素不能包含自己。

2、NodeA.compareDocumentPosition(NodeB)

这个方法是 DOM Level 3 specification 的一部分,允许你确定 2 个 DOM Node 之间的相互位置。这个方法比 .contains() 强大。这个方法的一个可能应用是排序 DOM Node 成一个详细精确的顺序。

使用这个方法你可以确定关于一个元素位置的一连串的信息。所有的这些信息将返回一个比特码(Bit,比特,亦称二进制位)。

这里是从 NodeA.compareDocumentPosition(NodeB) 返回的结果,包含你可以得到的信息。

Bits Number Meaning
000000 0 元素一致
000001 1 节点在不同的文档(或者一个在文档之外)
000010 2 节点 B 在节点 A 之前
000100 4 节点 A 在节点 B 之前
001000 8 节点 B 包含节点 A
010000 16 节点 A 包含节点 B
100000 32 浏览器的私有使用

猜你喜欢

转载自blog.csdn.net/lay136362687/article/details/80442217