🎯 I Tuoi Obiettivi

  • ✅ Seleziona il paragrafo con querySelector()
  • ✅ Seleziona i bottoni con querySelector()
  • ✅ Aggiungi un evento click al bottone principale
  • ✅ Quando clicchi, cambia il testo del paragrafo in "Hai cliccato! 🎉"
  • ✅ Il bottone Reset deve riportare il testo originale

👋 Ciao! Aspetto che tu clicchi il bottone...

📝 Istruzioni Passo-Passo

  1. Seleziona il paragrafo
    Usa document.querySelector('#testo')
  2. Seleziona i bottoni
    Usa document.querySelector('#bottone') e document.querySelector('#reset')
  3. Aggiungi l'evento click al bottone principale
    Usa addEventListener('click', function() { ... })
  4. Cambia il testo
    Dentro la funzione, usa .textContent per cambiare il testo in "Hai cliccato! 🎉"
  5. Aggiungi l'evento click al bottone reset
    Riporta il testo originale: "👋 Ciao! Aspetto che tu clicchi il bottone..."

💡 Suggerimenti

🎯 Ricorda i Selettori

  • #testo → seleziona l'elemento con ID "testo"
  • #bottone → seleziona l'elemento con ID "bottone"
  • #reset → seleziona l'elemento con ID "reset"

⚡ Struttura dell'Evento

bottone.addEventListener('click', function() {
    // Il tuo codice qui
});

📝 Cambiare il Testo

Usa .textContent per modificare il contenuto:

elemento.textContent = 'Nuovo testo';

🔄 Per il Reset

Il bottone reset funziona esattamente come il bottone principale, ma cambia il testo nel testo originale!

🎓 Cosa Imparerai

🎯

querySelector()

Come selezionare elementi HTML

⚡

addEventListener()

Come reagire ai click

📝

textContent

Come modificare il testo