element.replaceChild

Résumé

Remplace un nœud enfant de l'élément courant par un autre nœud.

Syntaxe

noeudRemplacé = noeudParent.replaceChild(nouvelEnfant, ancienEnfant);

• nouvelEnfant est le nouveau nœud qui remplacera ancienEnfant. Si nouvelEnfant existe déjà dans le DOM, il sera d'abord enlevé.
• ancienEnfant est le nœud existant à remplacer.
• noeudRemplacé est le nœud remplacé. C'est le même nœud que ancienEnfant.

Exemple

// <div>
//  <span id="spanEnfant">foo bar</span>
// </div>

// Crée un nœud d'élément vide
// sans ID, aucun attribut ni contenu
var sp1 = document.createElement("span");

// On lui donne un id de valeur 'nouveauSpan'
sp1.setAttribute("id", "nouveauSpan");

// On crée du contenu pour le nouvel élément
var sp1_content = document.createTextNode("nouvel élément span de remplacement.");

// On applique ce contenu au nouvel élément
sp1.appendChild(sp1_content);

// On construit une référence vers le noeud à remplacer
var sp2 = document.getElementById("spanEnfant");
var parentDiv = sp2.parentNode;

// On remplace le nœud sp2 existant par le nouvel élément span contenu dans sp1.
parentDiv.replaceChild(sp1, sp2);

Spécification

• DOM Level 2 Core : replaceChild — traduction en français (non normative)
• Introduit dans DOM Level 1 Core