JavaScript viene utilizzato con gli elementi HTML per creare applicazioni Web interattive. Viene aggiunto uno script con gli elementi HTML per generare messaggi pop-up, convalida del modulo, menu a discesa, ecc. JavaScript consente agli utenti di modificare il colore di sfondo degli elementi HTML. Questa azione può essere associata all'evento click del pulsante per fornire la funzionalità ogni volta che l'utente lo desidera.

Questo post fornisce approfondimenti per guidarti su come modificare il colore di sfondo premendo l'HTML pulsante.

Come cambia il colore di sfondo facendo clic sul pulsante in JavaScript?

JavaScript funge da catalizzatore con HTML e CSS per fornire un'interfaccia interattiva per una pagina Web. Questa sezione dimostra il codice JavaScript per trasformare il colore di sfondo dopo aver fatto clic su un pulsante.
La sintassi per la modifica del colore di sfondo in JavaScript è la seguente:

Sintassi

documento.getElementById ('id').stile.sfondoColor = 'color';

La sintassi è descritta come:

• colore di sfondo rappresenta la proprietà per modificare il colore di sfondo.
• getelementbyid Specifica di leggere e modificare l'elemento HTML specifico.
• colore indica il colore definito dall'utente per la visualizzazione.

Viene dato un esempio per convertire il colore di sfondo premendo/facendo clic sul pulsante.

Codice

Esempio per cambiare il colore di sfondo con JavaScript

Benvenuti in JavaScript World

Premere

Il codice è spiegato qui:

• Il div del documento HTML per il colore di sfondo ha una larghezza e un'altezza di 400px E 300px rispettivamente.
• Dopodiché, viene visualizzato un messaggio che dice "Benvenuti in JavaScript World"Nella sezione specificata.
• Un pulsante HTML è collegato con un tag pulsante associato a colorfunction () metodo.
• Usando questo metodo, il colore viene modificato dopo aver premuto il “Premere"Pulsante.
• Dopo aver chiamato l'evento Click del pulsante, il colore cambia a "arancia".

Output prima di fare clic sul pulsante:

Nell'output, il verde è presente sullo sfondo del testo "Benvenuti in JavaScript World". Inoltre, un pulsante HTML "Premere" è allegato.

Uscita dopo aver fatto clic sul pulsante:

Quando viene premuto il pulsante, il colore verde cambia in arancione come si può vedere nell'immagine sopra.

Conclusione

In JavaScript, il colore di sfondo viene modificato utilizzando la proprietà integrata dell'oggetto data. Questa proprietà può essere collegata a un evento al clic del pulsante. Facendo clic sul pulsante, il colore di sfondo verrà modificato. Qui hai imparato come il colore di sfondo viene modificato dopo aver fatto clic su un pulsante JavaScript.