Froggiesplaining :
-
où est le JavaScript ? Le code JavaScript est inclus dans la balise "script" tout
en bas de cette page html
- getElementById() ? Sélectionne les éléments HTML par leur id.
-
addEventListener('click', showMessage) ? Ajoute un événement pour détecter (il
"écoute"/ "listener") le clic sur le bouton.
-
showMessage() : Cette fonction est exécutée lorsque l'utilisateur clique sur le
bouton et affiche le texte du paragraphe.
Exercice :
sur la base de cet exemple, essayez de l'adapter à votre tour et d'ecrire un script similaire :
-
Cette fois il s'agit d'effacer un texte existant au chargement de la page, si on clique sur cette
image
-
et la faire revenir si on clique sur cette image
indices :
il y a plusieurs façons pour répondre à ça :
-
une méthode serait d'agir au clic sur le "style" du bloc a faire disparaitre, avec :
message.style.display = "block";
message.style.display = "none";
-
Une autre méthode serait d'injecter du html avec "innerHTML" : message.innerHTML = 'ici mes balises
html avec le bouton2';
(c'est ok pour un exercice local, mais cette méthode n'est pas recommandé en prod car faille
de sécurité)