Retourner à la page d'accueil de TJS

Objet : HTMLElement.parentNode

Elément parent de l'élément HTML en cours de manipulation

Syntaxe
element.parentNode

Compatibilité navigateurs

Description
Propriété en lecture seule contenant l'objet parent de l'élément HTML sur lequel il s'applique.

Exemple 1 : Retrouve l'élément TABLE depuis un TD
Code source
<table id="tableau">
<tr id="ligne1">
 <td onclick="getTable(this)">Colonne 1</td>
 <td onclick="getTable(this)">Colonne 2</td>
 <td onclick="getTable(this)">Colonne 3</td>
</tr>
<tr id="ligne2">
 <td onclick="getTable(this)">AB</td>
 <td onclick="getTable(this)">BC</td>
 <td onclick="getTable(this)">CD</td>
</tr>
<tr id="ligne3">
 <td onclick="getTable(this)">LK</td>
 <td onclick="getTable(this)">BV</td>
 <td onclick="getTable(this)">AA</td>
</tr>
</table>

<script type="text/javascript">
function getTable(td) {
 var tr=td.parentNode;
 console.log("tr id = "+tr.getAttribute("id"));
 var tbody=tr.parentNode;
 console.log("tbody id = "+tbody.getAttribute("id"));
 var tableau=tbody.parentNode;
 console.log("table id = "+tableau.getAttribute("id"));
}
</script>

Résultat
Colonne 1 Colonne 2 Colonne 3
AB BC CD
LK BV AA
Emulation de la console
Explication
Cliquez sur une cellule du tableau pour remonter à l'élément table.
Notez qu'un noeud tbody est généré par le navigateur même si il n'est pas défini par le code HTML.

Page en rapport
Introduction au DHTML
Page mise à jour le

Mon nouveau livre Tout JavaScript chez Dunod

Tout JavaScript le livre chez DunodEn savoir plus
Sortie le 14 novembre 2019

Version papier à 29€90
Format électronique à 22€99.

Commandez en ligne Dunod  Fnac  Amazon

Chercher une fonction, un objet, ...

Le graph des objets Javascript



Chargement
en cours...
Le 01/04/2020 13:50:37 sur php7 en 60.74 ms