父母的父母的父母

Question

在JavaScript中有一種簡單的方法來定位父母的父母？

我使用this.parentNode作爲函數的元素來選擇父項，我嘗試了this.parent.parentNode和this.parentNode.parentNode，但都只是簡單地返回直接父項。
我試圖影響圍繞'這'的div的div。我確實設法使用一個簡單的循環語句來重複父母節點選擇兩次，但我認爲還有更好的方法。

Answer 1

this.parentNode.parentNode是正確的，您必須（抱歉！）在您嘗試過的測試中發生錯誤。

例如：Live Copy | Source

HTML：

<div id="outermost">Outermost 
    <div id="inner1">Inner 1 
    <div id="inner2">Inner 2</div> 
    </div> 
</div> 

的JavaScript：

var inner2 = document.getElementById("inner2"); 

display("inner2.id = " + inner2.id); 
display("inner2.parentNode.id = " + inner2.parentNode.id); 
display("inner2.parentNode.parentNode.id = " + inner2.parentNode.parentNode.id); 

display("Try clicking the blue 'inner2' above"); 

inner2.onclick = function(e) { 
    display("Click: this.id = " + this.id); 
    if (this.parentNode) { 
    display("Click: this.parentNode.id = " + this.parentNode.id); 
    if (this.parentNode.parentNode) { 
     display("Click: this.parentNode.parentNode.id = " + this.parentNode.parentNode.id); 
    } 
    } 
}; 

function display(msg) { 
    var p = document.createElement('p'); 
    p.innerHTML = String(msg); 
    document.body.appendChild(p); 
} 

輸出（假設一個點擊的指示）：

inner2.id = inner2 
inner2.parentNode.id = inner1 
inner2.parentNode.parentNode.id = outermost 
Try clicking the blue 'inner2' above 
Click: e.target.id = inner2 
Click: e.target.parentNode.id = inner1 
Click: e.target.parentNode.parentNode.id = outermost