Comment changer l'image d'arrière-plan en javascript

En JavaScript, il existe des pages Web qui nécessitent une disposition attrayante, comme des arrière-plans sombres qui fonctionnent généralement mieux pour les interfaces. De même, les arrière-plans blancs permettent aux lecteurs de se concentrer sur le contenu, et donc les portails de nouvelles ou les blogs utilisent un fond relativement léger avec un texte sombre. Dans de tels cas, JavaScript devient très pratique dans la mise en forme et l'amélioration de la conception de documents.

Cet article discutera des méthodes pour modifier l'image d'arrière-plan en javascript.

Comment changer l'image d'arrière-plan en javascript?

Pour modifier l'image d'arrière-plan en JavaScript, les approches suivantes peuvent être utilisées:

• "image de fond«Propriété sur«Dom".
• "getElementByid ()«Méthode et«image de fond«Propriété sur«paragraphe".

Passer par les méthodes discutées une par une!

Méthode 1: Modifier l'image d'arrière-plan en javascript à l'aide de la propriété BackgroundImage sur DOM.

Le "image de fond»La propriété ajuste l'image d'arrière-plan de l'élément spécifié. Cette technique peut être appliquée en appliquant la propriété Background Image et en spécifiant l'image d'arrière-plan en localisant son chemin comme argument.

Syntaxe

Dans la syntaxe ci-dessus, "URL»Fait référence au chemin de l'image.

Regardez l'exemple suivant pour la démonstration.

Exemple

Dans cet exemple, un bouton sera inclus avec la valeur spécifiée et un ««sur clic»Événement redirigeant vers un
Fonction nommée BackgroundImage ():

Maintenant, une fonction "image de fond()"Sera déclaré et le"document.corps.style.image de fond»La propriété accédera à l'image d'arrière-plan à l'aide du chemin d'image spécifié dans son argument:

La sortie de l'implémentation ci-dessus en résultera comme suit:

Méthode 2: Modifier l'image d'arrière-plan en javascrip

Le "getElementByid ()”La méthode renvoie un élément avec une valeur spécifiée et le"image de fond»La propriété, comme indiqué ci-dessus, renvoie l'image d'arrière-plan de l'élément particulier spécifié dans son argument. Cette méthode peut être appliquée pour cartographier la couleur spécifiée en arrière-plan du paragraphe particulier.

Syntaxe

Ici, "élémentID»Fait référence à l'ID d'un élément.

Passer par l'exemple suivant pour une meilleure compréhension du concept déclaré.

Exemple

Tout d'abord, incluez un paragraphe dans le

Tag et attribuez-lui un ID spécifique:

Ensuite, créez un bouton avec un événement OnClick accédant à la fonction BackgroundImage () comme discuté dans la méthode précédente:

Enfin, déclarez la fonction nommée «image de fond()" de la même manière. Ici, accédez à l'ID défini en utilisant le «getElementByid ()»Méthode et appliquez l'image d'arrière-plan spécifiée dessus. Cela se traduira par la mise en œuvre de la couleur sur l'arrière-plan du paragraphe:

Sortir

Nous avons compilé la méthode la plus simple pour changer l'image d'arrière-plan en javascript

Conclusion

Pour modifier l'image d'arrière-plan en JavaScript, appliquez le «image de fond«Propriété sur«Dom«Pour appliquer l'image d'arrière-plan spécifiée sur toute la page Web en utilisant une fonction ou en obtenant l'ID particulier en utilisant«getElementByid ()"Méthode et application"image de fond«Propriété sur la spécifiée»paragraphe". Ce blog illustre les méthodes pour modifier les images d'arrière-plan en javascript.