evento HTML DOM
HTML DOM permite a los eventos de JavaScript que reaccionan a HTML.
Ejemplos
Reaccionar a los eventos
Cuando se produce un evento, puede ejecutar código JavaScript, por ejemplo, cuando un usuario hace clic en un elemento HTML.
Para ejecutar código cuando un usuario hace clic en un elemento, agregue el código JavaScript para el caso de atributos HTML:
ejemplos de eventos de HTML:
- Cuando el usuario hace clic en el ratón
- Cuando se carga la página
- Cuando la imagen es cargada
- Cuando el ratón se mueve sobre el elemento
- Cuando se cambia el campo de entrada
- Cuando se envía el formulario HTML
- Cuando el usuario activa la tecla
En este ejemplo, cuando un usuario hace clic en, que va a cambiar el contenido del elemento <h1>:
Ejemplos
<html>
<body>
<h1 onclick="this.innerHTML='Ooops!'">Click on this text!</h1>
</body>
</html>
Trate »
En este caso, la función será llamada desde el controlador de eventos:
Ejemplos
<html>
<head>
<script>
function changetext(id)
{
id.innerHTML="Ooops!";
}
</script>
</head>
<body>
<h1 onclick="changetext(this)">Click on this text!</h1>
</body>
</html>
Trate »
Atributos HTML Evento
Para asignar eventos a elementos HTML, puede utilizar los atributos de los eventos.
Ejemplos
Asignado al elemento de botón de un evento onclick:
Trate »
En el ejemplo anterior, cuando se hace clic en el botón, se lleva a cabo la función denominada displayDate.
Utilizar el DOM HTML para asignar un evento
evento HTML DOM permite el uso de JavaScript para asignar elementos HTML:
Ejemplos
Onclick asignado elemento de botón de evento:
document.getElementById("myBtn"). onclick =function(){ displayDate() };
</script>
Trate »
En el ejemplo anterior, la función llamada displayDate se asignan al id = myButn "elemento HTML.
Cuando se hace clic en el botón, la ejecución de la función.
onload evento y onunload
Cuando un usuario entra o sale de la página, se disparará proceso de carga y el evento onunload.
proceso de carga se puede utilizar para comprobar los visitantes el tipo de navegador y la versión en orden basado en la información para cargar diferentes versiones de una página.
proceso de carga y onunload para el manejo de cookies.
evento onchange
evento onchange a menudo se utiliza para validar el campo de entrada.
El siguiente ejemplo muestra cómo utilizar onchange. Cuando el usuario cambia el contenido del campo de entrada, será llamado función mayúsculas ().
onmouseover y onmouseout eventos
onmouseover y onmouseout eventos pueden utilizarse para activar las funciones cuando el puntero del ratón se mueve dentro o fuera de los elementos.
onmousedown, onmouseup y el evento onclick
onmousedown, onmouseup onclick evento es un clic del ratón y todo el proceso. En primer lugar, cuando se hace clic en un botón del ratón, desencadenar onmousedown evento, y luego, cuando se suelta el botón del ratón, se disparará onmouseup caso, y finalmente, cuando haga clic en el ratón en Finalizar, se activa el evento onclick.
HTML DOM evento de referencia de objetos
Para una descripción completa y ejemplos de cada evento, por favor visite nuestro manual de referencia HTML DOM .