Cómo cambiar el color de fondo después de hacer clic en el botón en JavaScript?

Cómo cambiar el color de fondo después de hacer clic en el botón en JavaScript?
Javascript se utiliza con los elementos HTML para crear aplicaciones web interactivas. Se agrega un script con los elementos HTML para generar mensajes emergentes, validación de formulario, menú desplegable, etc. JavaScript permite a los usuarios cambiar el color de fondo de los elementos HTML. Esta acción puede asociarse con el evento de clic del botón para proporcionar la funcionalidad siempre que el usuario lo desee.

Esta publicación proporciona una visión profunda para guiarlo sobre cómo cambiar el color de fondo presionando el HTML botón.

¿Cómo cambia el color de fondo haciendo clic en JavaScript??

JavaScript actúa como un catalizador con HTML y CSS para proporcionar una interfaz interactiva para una página web. Esta sección demuestra el código JavaScript para transformar el color de fondo después de hacer clic en un botón.
La sintaxis para cambiar el color de fondo en JavaScript es la siguiente:

Sintaxis

documento.getElementById ('id').estilo.backgroundColor = 'Color';

La sintaxis se describe como:

  • color de fondo representa la propiedad para cambiar el color de fondo.
  • GetElementByid Especifica que lee y edite el elemento HTML específico.
  • color denota el color definido por el usuario para la pantalla.

Se da un ejemplo para convertir el color de fondo presionando/haciendo clic en el botón.

Código






Ejemplo para cambiar el color de fondo con JavaScript



Bienvenido a JavaScript World






El código se explica aquí:

  • El Div del documento HTML para el color de fondo tiene un ancho y altura de 400px y 300px respectivamente.
  • Después de eso, se muestra un mensaje diciendo "Bienvenido a JavaScript World"En la sección especificada.
  • Se adjunta un botón HTML con una etiqueta de botón que está asociada con el Colorfunction () método.
  • Usando este método, el color se cambia después de presionar el "presionalo" botón.
  • Después de que se llama al evento de clic del botón, el color cambia a "naranja".

Salida antes de hacer clic en el botón:

En la salida, el verde está presente en el fondo del texto "Bienvenido a JavaScript World". Además, un botón HTML "presionalo" se adjunta.

Salida después de hacer clic en el botón:

Cuando se presiona el botón, el color verde cambia a naranja como se puede ver en la imagen de arriba.

Conclusión

En JavaScript, el color de fondo se cambia utilizando la propiedad incorporada del objeto de fecha. Esta propiedad se puede vincular con un evento al hacer clic del botón. Al hacer clic en el botón, se cambiará el color de fondo. Aquí has ​​aprendido cómo el color de fondo se cambia después de hacer clic en un botón en Javascript.