Clase 03

Fernando Alonso Blzquez
Programacin en
pginas Web:
JavaScript
04 de Marzo de 2004
Indice
Qu es un lenguaje Script?
Qu es JavaScript?
Qu se puede hacer con JavaScript?
Generalidades de JavaScript
La TAG <SCRIPT> </SCRIPT>
Modelo de Eventos de JavaScript
Gestores de Eventos (Event Handlers)
Clases en JavaScript
Jerarqua de Clases

Qu es un lenguaje Script?

Scripting system programming
Unos no sustituyen a los otros sino que estn
orientados a cosas diferentes
Extienden las capacidades de la aplicacin
con la que trabajan
Raramente se usan para algoritmos y
estructuras de datos complejas
Tienden a ser Typeless
Deteccin de errores en tiempo de ejecucin
Cdigo y datos son intercambiables
Un programa puede escribir otro y ejecutarlo.
Menos cdigo y programas ms flexibles
Problemas de SEGURIDAD
Qu es JavaScript?
Es un lenguaje Script
Extiende las capacidades de las pginas Web
El cdigo est integrado en el HTML
Se interpreta en el ordenador que recibe el
HTML, no se compila
Ejecucin dinmica
Los programas y funciones no se chequean hasta
que se ejecutan
Tiene programacin orientada a objetos
Trabaja con los elementos del HTML
No se declaran los tipos de variables
Qu se puede hacer con JavaScript?
Chequear Formularios
Comprobar que se han rellenado correctamente
antes de enviarlos y que el servidor de error
Validar Campo
Realizar clculos simples
Indice de Masa Corporal
Juegos
Battleship
O simplemente... pasar el tiempo
Mouse Trail Clock
Hacer interactiva una pgina web
Graficar Funciones
Check All
Generalidades de JavaScript
Modelo orientado al WWW
Elementos de una pgina HTML pueden
causar un evento que ejecutar una accin
Esa accin se ejecutar a travs de una
serie de sentencias JavaScript
Comandos de JavaScript:
Variables
Expresiones
Estructuras de control
Funciones (bloques de sentencias)
Clases, objetos y arrays (agrupaciones de datos)
Sintaxis

Atributo SRC: fichero cdigo fuente

Colocarlo en la seccin <HEAD> del HTML
No es necesario que est todo el cdigo all
Asegura que todo el cdigo haya sido definido
antes del <BODY> del documento.

<SCRIPT type="text/javascript" src="fuente.js"></SCRIPT>
La TAG <SCRIPT> </SCRIPT>
<SCRIPT type="text/javascript">
function valor_abs(form) {
var num = eval(form.expr.value)
if (num >= 0) form.result.value = num
else num = -num
form.result.value = num
}
</SCRIPT>
Modelo de Eventos de JavaScript
Los eventos suceden a tres niveles:
A nivel del documento HTML
A nivel de un formulario individual
A nivel de un elemento de un formulario
El evento es gestionado por una seccin de
cdigo en JavaScript (Gestor de Eventos)
Declaracin de Gestores de Eventos: similar a
los atributos en HTML

<BODY onLoad="cargarfuncion()" onUnload="descargarfuncion()">

<FORM name="nombre_del_formulario" ...
onSubmit="funcin_o_sentencia">

<INPUT type="button" name="mycheck" value="HA!" onClick=
"alert(Te he dicho que no me aprietes)">
Gestores de Eventos (Event Handlers)
Evento

Ocurre Cuando

Gestor

blur

El usuario quita el cursor de un elemento de formulario

onBlur

click

El usuario clica un link o un elemento de formulario

onClick

change

El usuario cambia el valor de un texto, un rea de texto o
selecciona un elemento.

onChange

focus

El usuario coloca el cursor en un elemento de formulario.

onFocus

load

El usuario carga una pgina en el Navegador

onLoad

Mouseover

El usuario mueve el ratn sobre un link

onMouseOver

Select

El usuario selecciona un campo del elemento de un formulario

onSelect

Submit

Se enva un formulario

onSubmit

Unload

Se descarga la pgina

onUnload

Estructura de un HTML con JavaScript
Funciones JavaScript
Dentro de un bloque <SCRIPT></SCRIPT>
Dentro del <HEAD> del documento

HTML no interactivo
Dentro del <BODY> del documento

HTML interactivo
Atributos Gestores de Eventos cuyos valores son
funciones de JavaScript definidas en el bloque
<HEAD> del HTML
Clases en JavaScript
Clases Predefinidas
Clase String: Cada vez que se asigna una cadena
de caracteres a una variable, se crea un objeto
de la clase String
Clase Math: Se usa para efectuar clculos
matemticos
Clase Date: Para el manejo de fechas y horas
Clases del Browser o Navegador
Tienen que ver con la navegacin
Clases del Documento HTML
Estn asociadas con cualquier elemento de una
pgina Web (link, ancla, formulario, etc)
Clases definidas por el usuario
Jerarqua de Clases
Ejemplo
<HTML>
<HEAD>
<TITLE>Ejemplo sencillo de pgina HTML</TITLE>
</HEAD>
<BODY>
<A name="principio">Este es el principio de la pgina</A> // ancla
<HR>
<FORM method="POST">
<P> Introduzca su nombre:<INPUT type="text" name="me" size="70"> </P>
<INPUT type="reset" value="Borrar Datos">
<INPUT type="submit" value="OK">
</FORM>
<HR>
Clica aqu para ir al
<A href="#principio">principio</A> de la pgina // link
</BODY>
</HTML>

document.title
document.anchors[0].name
document.forms[0].method
document.forms[0].elements[1].value
document.links[0].href
Para finalizar...

Referencia de JavaScript

Ejemplos
Fernando Alonso Blzquez
Programacin en
pginas Web:
JavaScript
04 de Marzo de 2004

Clase 03

Hochgeladen von

Dokumentinformationen

Copyright

Verfügbare Formate

Dieses Dokument teilen

Dokument teilen oder einbetten

Freigabeoptionen

Stufen Sie dieses Dokument als nützlich ein?

Sind diese Inhalte unangemessen?

Copyright:

Verfügbare Formate

Clase 03

Hochgeladen von

Copyright:

Verfügbare Formate

Fernando Alonso Blzquez

Das könnte Ihnen auch gefallen