|
PRIMER PROGRAMA
Ahora vamos paso a paso a construir nuestro primer programa, y así podremos ver los elementos principales del lenguaje y su colocación dentro del documento Web.
Sólo debemos seguir la teoría vista en los temas anteriores.
EJEMPLO 1: Llamada a una función desde un elemento del documento
<html>
<head>
<script>
function hola()
{
alert("Hola a todos");
}
</script>
<title>Autor:Ricardo Amezua</title>
</head>
<body onLoad=hola();>
</body>
</html>
EJEMPLO 2: Llamada a una función desde otra.
<html>
<head>
<script>
function hola()
{
alert("Hola a todos");
rehola();
}
function rehola()
{
alert(“hola de nuevo a todos”);
}
</script>
<title>Autor:Ricardo Amezua</title>
</head>
<body onLoad=hola();>
</body>
</html>
EVENTOS
Un evento es un mecanismo por el cual podemos detectar las acciones que realiza el usuario y llamar automáticamente a la función que tengamos asociada. Desde esta función realizaremos las acciones que tengamos desarrolladas.
SINTAXIS
<elemento nombre_evento=nombre_funcion([parametros]);>
La siguiente tabla muestra los eventos y manipuladores de JavaScript:
|
EVENTO
|
SE
PRODUCE AL..
|
|
onLoad
|
Terminar de cargar una página o frame
(entrar).
|
|
onUnLoad
|
Descargar una página o frame (salir).
|
|
onAbort
|
Abortar la carga de una página.
|
|
onError
|
Producirse algún error en la carga de
la página.
|
|
onMouseOver
|
Pasar el ratón por encima de un
enlace, area o frame.
|
|
onMouseOut
|
Dejar de estar el ratón encima de un
enlace, area o frame.
|
|
onMouseMove
|
Mover el ratón por el documento.
|
|
onKeyUp
|
Presionar una tecla.
|
|
onClick
|
Hacer click con el ratón.
|
|
onResize
|
Dimensionar la ventana del navegador.
|
|
onMove
|
Mover la ventana del navegador.
|
|
onChange
|
Modificar texto en un control de edición.
Sucede al perder el foco.
|
|
onSelect
|
Seleccionar texto en un control de
edición.
|
|
onFocus
|
Situar el foco en un control.
|
|
onBlur
|
Perder el foco un control.
|
|
onSubmit
|
Enviar un formulario.
|
|
onReset
|
Inicializar un formulario.
|
EJEMPLO
1
<html>
<head>
<script>
function hola(){alert("Hola a todos");}
function adios(){alert("Adios a todos");}
</script>
<title>Autor:Ricardo Amezua</title>
</head>
<body onLoad=hola(); onUnload=adios();>
</body>
</html>
EJEMPLO 2
<html>
<head>
<script>
function pulsa(){alert("Autor:RICARDO AMEZUA");}
function foco(){alert("Foco en la primera Caja");}
function tecla(){alert("Pulsada tecla");}
</script>
<title>Autor:Ricardo Amezua</title>
</head>
<body>
<input type="button" value="Autor" onClick=pulsa();>
<input type="text" size=”5” onFocus=foco();>
<input type="text" size=”5” onKeyPress=tecla();>
</body>
</html>
EJEMPLO 3
<html>
<head>
<script>
function cambio(){alert("Cambiado el tamaño");}
</script>
<title>Autor:Ricardo Amezua</title>
</head>
<body onResize=cambio();>
</body>
</html>
CONTINUAR
>
|
