Au sein du <div id="output"> se trouve un bouton <button> qui affiche une alert() lorsque l'on clique dessus. L'évènement est attaché par le biais d'addEventListener(). Il vous est demandé de retirer ce gestionnaire d'évènement... mais il y a un souci : il n'est pas possible d'utiliser removeEventListener() puisque ce n'est pas vous qui avez attaché l'évènement. Une solution très simple est de cloner l'élément, de le supprimer, et de réinsérer la copie, car lors d'un clonage, les gestionnaires d'évènement ne sont pas copiés ! Allez-y.
Écrivez le code qui permet de faire ça. Dès que c'est fait, cliquez sur le bouton Exécuter le script pour exécuter le code.
Écrivez votre code
Console d'erreurs
Pas d'erreurs d'exécution ou de syntaxe
Rendu #output
Source HTML
Solution
L'exercice est tout simple, à condition de savoir qu'il faut utiliser cloneNode(). Mais je vous l'avais dit, donc ça a dû bien se passer...
var button, parent, newest;
if (button = document.getElementById("clickme")) {
parent = button.parentNode;
newest = button.cloneNode(true);
parent.removeChild(button);
parent.appendChild(newest);
}
Sinon, on aurait pu utiliser replaceChild() pour aller plus vite, et surtout pour être certain de placer la copie à l'emplacement du bouton original :
var button, parent, newest;
if (button = document.getElementById("clickme")) {
parent = button.parentNode;
newest = button.cloneNode(true);
parent.replaceChild(newest, button);
}
Et plus court c'est mieux :
var button;
if (button = document.getElementById("clickme")) {
button.parentNode.replaceChild(button.cloneNode(true), button);
}
Un commentaire ? Un bug ? Contactez-moi !
Vous souhaitez proposer une autre solution ?
Un autre exercice ou une précision ?
Vous avez rencontré une erreur ?
Un exercice ne fonctionne pas ?
OpenClassrooms
Commentez directement dans le sujet dédié aux exercices