获取层次结构中div的位置

时间:2011-03-05 03:52:29

标签: javascript dom html traversal

我正在使用JavaScript,我需要找到给定整个DOM树的div的位置。当给出相同的树时,我需要知道从根开始的遍历将使我们到达我们正在看的div。请随时询问后续问题。

干杯。

2 个答案:

答案 0 :(得分:0)

这可能会让你走上正确的轨道。我并非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#prettify-lang"

答案 1 :(得分:0)

取决于您想要返回的内容。 它更容易从节点开始走向根, 而不是相反。

function descent(who, ret){
    var A= [];
    while(who.parentNode){      
        A[A.length]= ret? who: who.nodeName;
        who= who.parentNode;
    }
    return A.reverse();
}

/ *

test

var what= document.getElementById('funblurb1') 

descent(what)>>
HTML,BODY,DIV,DIV

descent(what,1)>>
[object HTMLHtmlElement],[object HTMLBodyElement],

[object HTMLDivElement],[object HTMLDivElement]

* /