HTML, CSS et JavaScript sont des éléments essentiels de la construction d'un site Web interactif. La plupart des développeurs ont utilisé le formatage CSS en ligne pour implémenter des styles dans des balises d'élément HTML. L'un d'eux, un attribut de style, a sa propre importance dans Changer la couleur d'arrière-plan des éléments HTML. Il est mis en œuvre sur divers éléments tels que rubriques, paragraphes, les tables, ou pages entières. Cet attribut de style peut également être utilisé via JavaScript. Cet article montre comment changer la couleur d'arrière-plan en javascript.

Comment changer la couleur d'arrière-plan en javascript?

La propriété "Couleur de l'arrière plan" est employé pour retourner la couleur de l'élément spécifié. Les utilisateurs peuvent accéder à l'élément HTML, puis appliquer cette propriété pour modifier la couleur d'arrière-plan. La syntaxe est donnée ici en attribuant la couleur d'arrière-plan en javascript.

Syntaxe

objet.style.backgroundColor = "couleur"

Dans cette syntaxe, "couleur»Représente la valeur de la couleur à attribuer au "Couleur de l'arrière plan" propriété d'un HTML objet.

Note: Les utilisateurs peuvent spécifier "couleur"Comme nom de la couleur, des valeurs RVB ou des codes de couleur hexagonale.

Exemple 1: Modifiez la couleur d'arrière-plan de la zone spécifiée en JavaScript

Un exemple est adapté pour modifier la couleur d'arrière-plan d'une zone spécifiée. L'exemple de code suivant fait référence à la modification de la couleur d'arrière-plan de la div «Id = txt»:

Code

Un exemple pour modifier la couleur d'arrière-plan

Bienvenue à JavaScript
Bouton

Dans ce code:

• Une zone spécifique est allouée par > Tags et un message "Bienvenue à JavaScript" est écrit dedans.
• UN "Bouton" est attaché avec le "Col ()" Méthode qui est déclenchée en appuyant.
• Dans le "Col ()" méthode, document.getElementbyid extrait la valeur de l'élément div ayant «Id = txt» et sa valeur est stockée dans une variable nommée «ucol".
• Finalement, le "style.Couleur de l'arrière plan" La propriété est employée pour modifier la couleur d'arrière-plan en attribuant «jaune".

Sortir

La sortie montre qu'en appuyant sur le bouton, la couleur d'arrière-plan du message est modifiée.

Exemple 2: Modifiez la couleur d'arrière-plan de toute la page en javascript

Un autre exemple consiste à modifier la couleur d'arrière-plan complète d'une page Web pour bleu en utilisant le Code hexagonal # 0000FF. Le code suivant fait référence au scénario indiqué ci-dessus:

Code

Bienvenue à Linuxhint

Changer la couleur d'arrière-plan

Le code est démontré comme:

• Un bouton «Changer la couleur d'arrière-plan» est employé, qui est associé à un "MyFun ()" méthode.
• Dans "MyFun ()", La propriété de style "Couleur de l'arrière plan" est réglé sur "# 0000FF" En tant que code hexadécimal.
• Le "MyFun ()" la méthode est déclenchée sur le "sur clic" En appuyant sur le bouton.

Sortir

La sortie montre que la couleur d'arrière-plan est passée du blanc au bleu en appuyant sur le bouton dans la fenêtre du navigateur.

Conclusion

En javascript, le style.backgroundcoloLa propriété R est utilisée pour changer la couleur d'arrière-plan. La valeur de couleur peut être en RVB, code hexadécimal ou son nom. Dans cet article, deux exemples sont fournis pour modifier la couleur d'arrière-plan par nom et le code hexadécimal d'une zone spécifique ainsi que de toute la page. Le Couleur de l'arrière plan La propriété est utile pour modifier la couleur d'arrière-plan des en-têtes, des tables ou des éléments spécifiés.