获取元素的父div

Question

这应该很简单,但我遇到了麻烦.如何获取子元素的父div？

我的HTML:

<div id="test">
    <p id="myParagraph">Testing</p>
</div>

我的JavaScript:

var pDoc = document.getElementById("myParagraph");
var parentDiv = ??????????   

我会想document.parent或parent.container会工作,但我一直在not defined犯错误.请注意,它pDoc是定义的,而不是它的某些变量.

有任何想法吗？

PS我希望尽可能避免使用jQuery.

Answer 1

你正在寻找parentNode,Element继承自Node:

parentDiv = pDoc.parentNode;

方便参考:

• DOM2核心规范 - 得到所有主流浏览器的良好支持
• DOM2 HTML规范 - DOM和HTML之间的绑定
• DOM3核心规范 - 一些更新,并非所有主流浏览器都支持
• HTML5规范 - 现在包含DOM/HTML绑定

Answer 2

如果您正在寻找比直接父级更远的特定类型的元素,您可以使用一个上升到DOM的函数,直到它找到一个,或者不是:

// Find first ancestor of el with tagName
// or undefined if not found
function upTo(el, tagName) {
  tagName = tagName.toLowerCase();

  while (el && el.parentNode) {
    el = el.parentNode;
    if (el.tagName && el.tagName.toLowerCase() == tagName) {
      return el;
    }
  }

  // Many DOM methods return null if they don't 
  // find the element they are searching for
  // It would be OK to omit the following and just
  // return undefined
  return null;
}

Answer 3

该属性pDoc.parentElement或pDoc.parentNode将获得父元素.