Obtener el div padre del elemento

208

Esto debería ser realmente simple pero estoy teniendo problemas con eso. ¿Cómo obtengo un div padre de un elemento hijo?

Mi HTML:

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

Mi JavaScript:

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

Pensé document.parento parent.containerfuncionaría, pero sigo recibiendo not definederrores. Tenga en cuenta que el pDocestá definido, pero no ciertas variables del mismo.

¿Algunas ideas?

PD: Preferiría evitar jQuery si es posible.

ARMÓNICO
fuente

Respuestas:

33

Si está buscando un tipo particular de elemento que está más lejos que el elemento primario inmediato, puede usar una función que suba el DOM hasta que encuentre uno, o no:

// 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;
}
RobG
fuente
with jQuery: el.closest (tagName)
Ullullu
3
@ Ullullu: veamos, ¿10.000 líneas de biblioteca o una función de 10 líneas? ;-)
RobG
14

La propiedad pDoc.parentElemento pDoc.parentNodele conseguirá el elemento padre.

Thor Jacobsen
fuente
0

Esto podría ayudarte.

ParentID = pDoc.offsetParent;
alert(ParentID.id); 
Sinan ÇALIŞKAN
fuente
-1

Conocer el elemento primario de un elemento es útil cuando intenta ubicarlos en el "flujo real" de los elementos.

Debajo del código dado saldrá la identificación del padre del elemento cuya identificación se proporciona. Se puede utilizar para el diagnóstico de desalineación.

<!-- Patch of code to find parent -->
<p id="demo">Click the button </p>
<button onclick="parentFinder()">Find Parent</button>
<script>
function parentFinder()
{
    var x=document.getElementById("demo"); 
    var y=document.getElementById("*id of Element you want to know parent of*");
    x.innerHTML=y.parentNode.id;
}
</script>
<!-- Patch ends -->
vish0910
fuente