在javascript中找到两个DOM节点的第一个共同父节点的最佳方式是什么？

Question

我的问题就是这样，但在上下文中我想检查选择对象，比较anchorNode和focusNode，如果它们不同，那么找到第一个共同父元素。

var selected = window.getSelection(); 
var anchor = selection.anchorNode; 
var focus = selection.focusNode; 

if (anchor != focus) { 
    // find common parent... 
} 

Answer 1

我会尝试这样的事情，假设没有JS库

function getAncestors(node) { 
    if(node != document) return [node].concat(getAncestors(node.parentNode)); 
    else return [node]; 
} 

if(Array.prototype.indexOf === undefined) { 
    Array.prototype.indexOf = function(element) { 
     for(var i=0, l=this.length; i<l; i++) { 
      if(this[i] == element) return i; 
     } 
     return -1; 
    }; 
} 

然后就可以调用findFirstCommonAncestor(myElementA, myElementB)。

Answer 2

这种方式相当简单：

var fp = $(focus).parents(); 
var ap = $(anchor).parents(); 
for (var i=0; i<ap.length; i++) { 
    if (fp.index(ap[i]) != -1) { 
    // common parent 
    } 
} 

遍历一个元素的parents()和使用，直到找到一个匹配（或不）查看它们是否包含在其他的parents() 。使用该实用程序

function findFirstCommonAncestor(nodeA, nodeB, ancestorsB) { 
    var ancestorsB = ancestorsB || getAncestors(nodeB); 
    if(ancestorsB.length == 0) return null; 
    else if(ancestorsB.indexOf(nodeA) > -1) return nodeA; 
    else if(nodeA == document) return null; 
    else return findFirstCommonAncestor(nodeA.parentNode, nodeB, ancestorsB); 
} 

：

Answer 3

//现在看来似乎应该是相当简单的，即使没有图书馆或的indexOf

document.commonParent= function(a, b){ 
var pa= [], L; 
while(a){ 
    pa[pa.length]=a; 
    a= a.parentNode; 
} 
L=pa.length; 
while(b){ 
    for(var i=0; i<L; i++){ 
    if(pa[i]==b) return b; 
    } 
    b= b.parentNode; 
} 
}