Question

我有一些简单的HTML，并且在页面加载后想要一个div来获取其容器div的属性。以下是HTML的示例：

<div id=menuBar>
  <div id=menuButton>
    <div id=menuButtonSub>
    </div>
  </div>
</div>

当我运行此JavaScript时：

document.getElementById("menuButtonSub").parentNode.id

它返回＆＃34; menuBar＆＃34;而不是＆＃34; menuButton＆＃34;。任何线索为什么？还在学习，但到目前为止，大多数事情都很顺利。

以下是相关的CSS：

#menuBar {
    width:100%;
    min-height:50px;
    background-color:#808080;
}
.menuButton {
    color:#ffffff;
    font-size:20px;
    min-height: 50px;
    text-align:center;
    vertical-align:middle;
    line-height:50px;
    float:left;
}
.menuButton:hover {
    color: #1a448f;
    background-color: #ffffff;
}
.menuButtonSub {
    background-color:red;
    color:#ffffff;
    min-height:50px;
    line-height:50px;
    text-align:center;
    line-height:50px;
    font-size:20px;
    margin:0;
    padding:0;
}

Answer 1

我能够使用以下代码重现这一点。您很可能在HTML中有错误/拼写错误（我在menuBar div上缺少标记结束字符）。尝试通过验证器运行它。

document.body.innerHTML += document.getElementById("menuButtonSub").parentNode.id;

<div id='menuBar'
  <div id='menuButton'>
    <div id='menuButtonSub'>
    </div>
  </div>
</div>

JavaScript parentNode跳过容器div

1 个答案: