javascript - 获取 div 在层次结构中的位置

Question

我正在使用 JavaScript，我需要在给定整个 DOM 树的情况下找到 div 的位置。当给定同一棵树时，我需要最终知道从根开始的遍历将使我们到达我们正在查看的 div。请随时提出后续问题。

干杯。

Answer 1

这可能会让您走上正轨。我不能 100% 确定 getAttribute 的浏览器覆盖率，因此如果需要，请在目标浏览器上进行测试。

getNodeAndParent = function(o) {
    var nodeTarget,strParents,strNodeName,strNodeId,strNodeClass,strReturnValue;
    if (o.constructor === String) {
        nodeTarget = document.getElementById(o);
        if (nodeTarget === undefined) {
            throw "You must specify a valid node ID";
        }
    }
    else {
        nodeTarget = o;
    }
    strNodeName = nodeTarget.nodeName
    strNodeId = nodeTarget.getAttribute('id');
    strNodeClass = nodeTarget.className;
    strReturnValue = strNodeName + (strNodeId ? '#' + strNodeId : '') + (strNodeClass ? '.' + strNodeClass : '');
    if (strNodeName.toLowerCase() !== 'html') {
        strReturnValue = getNodeAndParent(nodeTarget.parentNode) + ' > ' + strReturnValue;
    }

    return strReturnValue;
}

//Example:
getNodeAndParent('prettify-lang');

如果在 Firebug 中针对这个问题页面运行它，你会得到 "HTML > BODY.question-page > DIV.container > DIV#content > DIV#pretify-lang"