web-dev-qa-db-fra.com

Obtenir le parent div de element

Cela devrait être très simple mais cela me pose problème. Comment obtenir un parent d'un élément enfant?

Mon HTML:

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

Mon JavaScript:

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

J'aurais pensé que document.parent ou parent.container fonctionnerait, mais je continue à avoir des erreurs not defined. Notez que la pDoc est définie, mais pas certaines de ses variables.

Des idées?

P.S. Je préférerais éviter jQuery si possible.

183
OVERTONE

Vous recherchez parentNode , qui Element hérite de Node :

parentDiv = pDoc.parentNode;

Références pratiques:

  • DOM2 Core spécification - bien supporté par tous les principaux navigateurs
  • DOM2 HTML spécification - liaisons entre DOM et HTML
  • DOM3 Core spécification - certaines mises à jour, pas toutes prises en charge par tous les principaux navigateurs
  • spécification HTML5 - qui contient maintenant les liaisons DOM/HTML
299
T.J. Crowder

Si vous recherchez un type d'élément particulier plus éloigné que le parent immédiat, vous pouvez utiliser une fonction qui remonte le DOM jusqu'à ce qu'il en trouve un ou ne le fait pas:

// 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;
}
31
RobG

La propriété pDoc.parentElement ou pDoc.parentNode vous donnera l'élément parent.

12
Thor Jacobsen

Cela pourrait vous aider.

ParentID = pDoc.offsetParent;
alert(ParentID.id); 
2
Sinan ÇALIŞKAN

var parentDiv = pDoc.parentElement

edit: c'est parfois parentNode dans certains cas.

https://developer.mozilla.org/en-US/docs/Web/API/Node/parentElement

2
LoganDark

Connaître le parent d'un élément est utile lorsque vous essayez de le positionner dans le "flux réel" des éléments.

Le code ci-dessous donnera l'id du parent de l'élément dont l'id est fourni. Peut être utilisé pour le diagnostic de désalignement.

<!-- 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 -->
0
vish0910