javascript - jQuery/Javascript检查文本重叠

我想知道是否有什么好的方法来检查两个html元素的文本是否重叠？
证明：检查元素之间是否有重叠问题我想检查一下2个元素内部的实际文本是否重叠。

说我有要素

<span id="green">Green is my cÔlor</span>
<span id="blue">blue is my color</span>

如何检查这两个元素的文本是否重叠？
我们可以假设我可以访问给定元素的jQuery对象。

编辑：
我想说的是，我是否可以检测到元素的边界是否相交，但是在文本的情况下，每个字符上方和下方的大部分空间都可能“未被使用”。

最佳答案

function getPositions(elem) {
    var clientRect = elem.getBoundingClientRect();
    return [
        [ clientRect.left, clientRect.left + clientRect.width ],
        [ clientRect.top, clientRect.top + clientRect.height ]
    ];
}


function intersect(elemA, elemB) {
    var posA = getPositions(elemA),
        posB = getPositions(elemB),
        isOverlap = false;

    if (posA[0][0] < posB[0][1] && posA[0][1] > posB[0][0] &&
        posA[1][0] < posB[1][1] && posA[1][1] > posB[1][0])
        isOverlap = true;

    return isOverlap;
}