JavaScript OnClick
Introducción
JavaScript es un lenguaje de programación bien conocido. Se usa en más del 95% de los sitios web que interactuamos diariamente. A menudo puede ver que en el clic de un botón, se cambia una página completa, se abre un campo de formulario o aparece un cuadro emergente. Desde la perspectiva de un programador/desarrollador, ¿cómo podemos implementar dicha funcionalidad y manejar las interacciones del sitio web con los usuarios?? Cuando se trata de interacción, JavaScript proporciona funciones integradas para controlar los eventos en un sitio.
Hay dos tipos de eventos en JavaScript:
- Oyente de eventos - escucha y espera a que el evento sea despedido
- Controlador de eventos - ejecutado cuando se dispara un evento
En este artículo, aprenderá sobre el controlador de eventos más utilizado de JavaScript, el al hacer clic evento. Hay otros controladores de eventos para flotar sobre un elemento o para las presiones de teclado de teclado, pero en este artículo, nos centraremos en el evento OnClick.
El evento OnClick se utiliza para realizar ciertas tareas con el clic de un botón o interactuando con un elemento HTML.
Ahora le mostraremos un ejemplo para demostrar cómo funciona el evento OnClick.
Ejemplo: cambie de texto usando OnClick
En este ejemplo, cambiaremos una selección de texto con el clic de un botón usando el evento OnClick. Primero, haremos una etiqueta de párrafo y le daremos una identificación de "párrafo" para acceder a ella más tarde. Crearemos un botón con el evento OnClick y llamaremos a la función llamada "Cambiar."
Linuxhint
En el archivo de script, crearemos una variable de indicador que nos permitirá verificar el estado del texto en nuestra etiqueta de párrafo HTML. Luego, escribiremos una función que define la función "Cambiar". En la definición de función, crearemos una declaración "si", en la que verificaremos el estado utilizando la variable de indicador. También cambiaremos el texto y alteraremos la bandera. Es un código bastante simple!
var a = 1;cambio de función ()
if (a == 1)
documento.getElementById ("párrafo").innerhtml = "Linuxhint es increíble"
a = 0;
demás
documento.getElementById ("párrafo").innerhtml = "Linuxhint"
a = 1;
Está bien! Después de escribir todo este código, ejecutaremos el código, nos moveremos a nuestro navegador y haremos clic en el botón recién creado. Después de hacer clic en el botón, el texto debe cambiarse de "Linuxhint" a "Linuxhint es increíble."
Podemos aplicar la misma técnica en cualquier lugar para cambiar el contenido de nuestro sitio web de acuerdo con nuestras necesidades. Podemos usarla para cambiar una imagen o realizar cualquier tipo de tarea que podamos imaginar con esta herramienta.
Conclusión
Este artículo explica cómo usar el evento OnClick. En este artículo, aprendiste el concepto de la función OnClick de una manera práctica. El uso del evento OnClick es tan simple, incluso un principiante puede comenzar a trabajar con esta función. Puede continuar aprendiendo, trabajando y ganando más experiencia en JavaScript en Linuxhint.com para tener una mejor comprensión de este lenguaje de programación. Muchas gracias!