Méthode HTML DOM removeChild()
Exemple
Supprimez le premier élément <li> d'une liste :
var list = document.getElementById("myList"); // Get the <ul> element with id="myList"
list.removeChild(list.childNodes[0]); // Remove <ul>'s first child node (index 0)
Avant de supprimer :
- Café
- Thé
- Lait
Après suppression :
- Thé
- Lait
Plus d'exemples "Essayez-le vous-même" ci-dessous.
Définition et utilisation
La méthode removeChild() supprime un nœud enfant spécifié de l'élément spécifié.
Renvoie le nœud supprimé en tant qu'objet Node, ou null si le nœud n'existe pas.
Remarque : Le nœud enfant supprimé ne fait plus partie du DOM. Cependant, avec la référence renvoyée par cette méthode, il est possible d'insérer ultérieurement l'enfant supprimé dans un élément (voir "Plus d'exemples").
Astuce : Utilisez la méthode appendChild() ou insertBefore() pour insérer le nœud supprimé dans le même document. Pour l'insérer dans un autre document, utilisez la méthode document.adoptNode() ou document.importNode() .
Prise en charge du navigateur
| Method | |||||
|---|---|---|---|---|---|
| removeChild() | Yes | Yes | Yes | Yes | Yes |
Syntaxe
node.removeChild(node)
Valeurs des paramètres
| Parameter | Type | Description |
|---|---|---|
| node | Node object | Required. The node object you want to remove |
Détails techniques
| Valeur de retour : | Un objet Node, représentant le nœud supprimé, ou null si le nœud n'existe pas |
|---|---|
| Version DOM | Objet de nœud principal de niveau 1 |
Plus d'exemples
Exemple
Découvrez si une liste a des nœuds enfants. Si tel est le cas, supprimez son premier nœud enfant (index 0) :
// Get the <ul> element with id="myList"
var list = document.getElementById("myList");
// If the <ul> element has any child nodes, remove its first child node
if (list.hasChildNodes()) {
list.removeChild(list.childNodes[0]);
}
Avant de supprimer :
- Coffee
- Tea
- Milk
Après suppression :
- Tea
- Milk
Exemple
Supprimez tous les nœuds enfants d'une liste :
// Get the <ul> element with id="myList"
var list = document.getElementById("myList");
// As long as <ul> has a child node, remove it
while (list.hasChildNodes()) {
list.removeChild(list.firstChild);
}
Avant de supprimer :
- Coffee
- Tea
- Milk
Après suppression :
Exemple
Supprimez un élément <li> avec id="myLI" de son élément parent (sans spécifier son nœud parent) :
var item = document.getElementById("myLI");
item.parentNode.removeChild(item);
Avant de supprimer :
- Coffee
- Tea
- Milk
Après suppression :
- Coffee
- Milk
Exemple
Supprimez un élément <li> de son parent et insérez-le à nouveau :
var item = document.getElementById("myLI");
function removeLi() {
item.parentNode.removeChild(item);
}
function appendLi() {
var list = document.getElementById("myList");
list.appendChild(item);
}
Exemple
Supprimez un élément <span> de son parent et insérez-le dans un élément <h1> dans un autre document :
var child = document.getElementById("mySpan");
function removeLi() {
child.parentNode.removeChild(child);
}
function myFunction() {
var frame = document.getElementsByTagName("IFRAME")[0]
var h = frame.contentWindow.document.getElementsByTagName("H1")[0];
var x = document.adoptNode(child);
h.appendChild(x);
}