獲得div在分層結構中的位置

我正在使用JavaScript，並且我需要在給定整個DOM樹的情況下找到div的位置。當給定同一棵樹時，我需要最終知道從根開始的遍歷，這將使我們看到我們正在查看的div。請隨時詢問跟進問題。獲得div在分層結構中的位置

乾杯。

2011-03-05 sparkFinder

你真的需要遍歷整個事情？ – Orbit 2011-03-05 03:54:00

是的，從根。 – sparkFinder 2011-03-05 04:20:16

這可能會讓你走上正確的軌道。我並非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"

來源

2011-03-05 04:35:05 Andrew

這是我考慮的事情之一 - 最終使用xPath。 – sparkFinder 2011-04-20 18:40:18

取決於你想回到什麼。它更簡單的從節點開始，朝向根而不是相反。

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]

來源

2011-03-05 04:59:22 kennebec

獲得div在分層結構中的位置

回答

相關問題