Cómo hacer un Div Hickable usando JavaScript

Cómo hacer un Div Hickable usando JavaScript
El El elemento es la etiqueta más importante y comúnmente utilizada en el desarrollo web. Define una sección o división en un documento HTML. Además, los usuarios pueden modificar las diferentes propiedades de estilo en el Etiquetas como color de fondo, tamaño de fuente, color de texto, y cualquiera de la funcionalidad que se puede aplicar haciendo clic en el Div. Uno puede agregar una funcionalidad específica al hacer clic en el DIV. En esta publicación, demostraremos varios métodos para hacer que un Div haga clic en JavaScript.
  • Cómo hacer un Div Clickable en JavaScript
  • Ejemplo 1: Uso del método addEventListener () para hacer un Div Clickable
  • Ejemplo 2: Uso de la etiqueta para hacer una URL haciendo clic en

Cómo hacer un Div Clickable en JavaScript?

JavaScript proporciona addEventListener () Método para hacer un texto en clic en etiqueta. Además, una función simple también se puede asociar con la funcionalidad de entrada de la etiqueta DIV para hacer que un Div haga clic en. La operación que se puede hacer clic se puede aplicar accediendo a la identificación o clase atributo. Los usuarios pueden colocar cualquier contenido dentro de un Etiqueta para mostrar en el navegador. Intentemos ambos métodos para hacer un Div HagaBABLE en JavaScript.

Ejemplo 1: Uso del método addEventListener () para hacer un Div Clickable

El método addEventListener () se aplica a través del Etiqueta para hacer un Div Clickable en JavaScript. El método se desencadena por una asociación con un evento en particular. Al considerarlo, se sigue un código con Etiquetas para hacer un texto en JavaScript en JavaScript.

Código



Ejemplo para hacer clic en JavaScript


Presione el Div Hacible



El código se ilustra a continuación:

  • En primer lugar, un se especifica el área en la que contiene un mensaje "Presione el Div" tener una identificación única de "CL".
  • Después de eso, el getElementById () El método se utiliza para extraer el HTML elemento por su "CL" valor.
  • Además, el addEventListener () El método se emplea para agregar un controlador de eventos pasando "hacer clic" y "CL_DIV" argumentos.
  • Al final, un cl_div () se llama método que devuelve un mensaje "Bienvenido a JavaScript" empleando el innerhtml propiedad.

Producción

La salida devuelve el navegador en el que el usuario hacer clics en el div y el div La etiqueta se cambia a "Bienvenido a JavaScript".

Ejemplo 2: Uso de la etiqueta para hacer una URL que se pueda hacer clic en un DIV

El La etiqueta es famosa por redirigir a otros enlaces o páginas web. Esta etiqueta tiene un "href"Atributo que acepta la URL de una página web específica. Practiquemos usarlo a través del siguiente código de ejemplo:

Código


Ejemplo para hacer un Div Haga clic en JavaScript


"https: // linuxhint.com/"

El código anterior se explica por línea:

  • Primero un el área se especifica y se le asigna un valor de clase de "Haga clic".
  • Después de eso, un La etiqueta se aplica pasando el enlace "https: // linuxhint.com ".
  • Presionando el enlace, se refiere al div Tener la clase "que se puede hacer clic".
  • Después de eso, el ventana.ubicación() El método obtiene el "URL" de la página web especificada a través del attr () método.

Producción

La salida muestra que cuando un usuario presiona el enlace "Haga clic en enlace", Aparece una nueva ventana en el navegador.

Conclusión

En JavaScript, un incorporado addEventListener () El método o una función definida por el usuario se puede utilizar para hacer que un DIV haga clic en. El addEventListener () El método toma dos argumentos, el primer argumento debe ser 'hacer clic'Y el segundo argumento debe apuntar hacia el Div (utilizando su clase nombre o identificación). En una función definida por el usuario, la función se adjunta al evento OnClick del div Para hacer que el div haga clic en. Este blog ha demostrado todos los métodos posibles para hacer que un Div haga clic en JavaScript.