Come cambiare un colore di sfondo dell'elemento in JavaScript

Utilizzando JavaScript, potrebbe essere necessario evidenziare alcuni dati o un elemento nella tua pagina web. Inoltre, migliora la visibilità dell'elemento utilizzando colori diversi e rende la pagina Web complessiva più attraente. In tali casi, l'aggiunta e la modifica del colore di sfondo di un elemento è molto efficace nel attirare l'attenzione del lettore e nel migliorare la progettazione del sito Web.

Questo articolo ti guiderà a modificare lo sfondo dell'elemento in JavaScript.

Come cambiare un colore di sfondo dell'elemento in JavaScript?

Per modificare il colore di sfondo di un elemento in JavaScript, applica le seguenti tecniche:

• Proprietà di sfondo con colore
• Proprietà BackgroundColor con codice colore

Gli approcci menzionati saranno dimostrati uno per uno!

Metodo 1: modificare un colore di sfondo dell'elemento in JavaScript usando la proprietà sfondo con colore

IL "colore di sfondo"La proprietà imposta il colore di sfondo dell'elemento specificato. Questa proprietà può essere implementata su uno qualsiasi degli elementi HTM aggiunti accedendo al suo ID e assegnandolo un colore di sfondo.

Sintassi

Qui, il "oggetto"Si riferisce all'elemento su cui verrà applicato il colore di sfondo.

Il seguente esempio spiega il concetto dichiarato.

Esempio

Nell'esempio seguente, al tag di intestazione verrà assegnato un ID chiamato "id" e il "Colore di sfondo!" valore:

Successivamente, nel file JavaScript, il "documento.getElementById ()Il metodo "accederà al"id"Dell'elemento intestazione. Successivamente, la proprietà di sfondo assegnerà il valore del colore "Verde chiaro"Contro l'ID, che si riferisce al valore di intestazione specificato nel passaggio precedente:

L'output dell'implementazione di cui sopra risulterà come segue:

Nell'output, si osserva che il colore di sfondo viene applicato solo all'elemento di intestazione selezionato.

Metodo 2: modificare un colore di sfondo dell'elemento in JavaScript utilizzando la proprietà sfondo con codice colore

Come discusso in precedenza, il "colore di sfondo"La proprietà imposta il colore di sfondo dell'elemento specificato. Questa proprietà può anche essere implementata sull'elemento specificato utilizzando il codice colore RGB.

Guarda il seguente esempio per la dimostrazione:

Esempio

In primo luogo, aggiungeremo un paragrafo usando il

tagga e assegnalo un ID chiamato "id"E un valore come mostrato di seguito:

Successivamente, il "getElementById ()"Il metodo accederà allo stesso modo l'elemento paragrafo con l'ID specificato e assegnerà il colore di sfondo utilizzando la proprietà sfondo. Qui, "#090"Indica il"RGB"Codice di tonalità scura media di colore verde:

Produzione

Nell'implementazione di cui sopra, il colore verde è il risultato di "RGB-> 090", In cui 9 si riferisce all'intensità del colore verde.

Conclusione

Per cambiare il colore di sfondo di un elemento in JavaScript, il “colore di sfondo"La proprietà con il metodo colore può essere utilizzata per accedere all'ID specifico e assegnare un particolare colore di sfondo. È usato con il “RGB"Codice per applicare una tonalità specifica di colore all'elemento HTML selezionato. Questo articolo guidato in relazione al metodo per modificare il colore di sfondo dell'elemento in JavaScript.