DOCUMENTO PARA LOS ESTUDIANTES

Java Script
Primera clase - 1
Maritzol Tenemaza

2009

PERSONAL
 documento para los estudiantes 2
Java Script

EVENTO EW-09: Programación en JavaScript (48h)

Objetivos:

Realizar aplicaciones cliente con JavaScript para la

interacción con el lado del servidor.

5 ESPECIALIZACIÓN EN DISEÑO Y ANIMACION WEB

Crear guiones o scripts que se incluyen en las páginas Web

y que sean ejecutados por el navegador que utiliza el
usuario.

Realizar tareas como la validación de los datos enviados por

el usuario en un formulario que deben ser llevadas a cabo
mediante la programación del lado cliente.

Contenidos:

• Introducción general a JavaScript.

• Estructuras de programación

• Funciones de control. Funciones y arrays

• Programación visual.

• Programación orientada a objetos.

• Asociación, agregación y composición

• Herencia frente a composición

 documento para los estudiantes 3
Java Script

• Sobre el uso de switch (frente al polimorfismo)

• Sobre el uso de instanteof

• Clases de utilidad

• Polimorfismo frente a genericidad

• Liberación de recursos

• Clonación de objetos

• Criterios de creación de clases

• JavaScript y Formularios

• JavaScript y la Web

• Proyecto de Aplicación del Evento

 documento para los estudiantes 4
Java Script

Tabla de contenido
Primera Clase .............................................................................................................................. 6

Introducción general de Java Script ..................................................................................... 6

Colocando código JavaScript ............................................................................................... 6

Sintaxis correcta para incluir código JavaScript ........................................................ 7

Otro tag : noscript............................................................................................................ 8

Nuestro Primer Script .......................................................................................................... 9

Otra manera de Introducir JavaScript ........................................................................... 11

Variables y Tipos de Datos ................................................................................................. 12

Declaración explícita ....................................................................................................... 12

Declaración implícita........................................................................................................ 12

Reglas para definir los nombres de las variables ........................................................ 13

Operaciones Numéricas................................................................................................... 14

Otras formas de expresar datos numéricos ................................................................ 18

Determinar el tipo de una variable ................................................................................ 20

Cambiar el tipo de una variable ...................................................................................... 20

Datos booleanos y lógicos ............................................................................................... 26

Variables indefinidas y nullas. ........................................................................................ 26

Reasignación dinámica de variables ............................................................................... 27

Funciones de ingreso y despliegue aprendidas hasta aquí ................................................ 29

Alert(texto);............................................................................................................................. 29

Estructuras de Control ........................................................................................................... 30

Condicionales......................................................................................................................... 30

Bucles ..................................................................................................................................... 32

La POO y el DOM ..................................................................................................................... 34

La POO ................................................................................................................................... 34

EL DOM DE JAVASCRIPT ..................................................................................................... 38

La Jerarquía de Objetos: ................................................................................................... 38

 documento para los estudiantes 5
Java Script

Abreviando Código ............................................................................................................... 39

Eventos fundamentales en JavaScript ................................................................................. 40

Trabajo para la primera semana ............................................................................................ 51

 documento para los estudiantes 6
Java Script

Primera Clase

Introducción general de Java Script

Browsers: Fox o Internet Explorer.

JavaScript al igual que HTML es un lenguaje interpretado;

una vez incluido en nuestra página un código en JavaScript, el
navegador se encarga de leer cada línea interpretarla sobre
la marcha y ejecutarla.
JavaScript define variables que pueden almacenar cualquier
tipo de datos. Es case sensitive, es decir debe escribirse
respetando mayúsculas y minúsculas.
A pesar de haber sido creado para el navegador de Nescape,
Hoy todos los navegadores lo soportan.

Colocando código JavaScript

Java Script se emplea en una página web para dotarla de
funcionalidades que el HTML no puede proporcionar por si
mismo.
JavaScript se lo integra en un documento HTML.
<script> código </script>
El tag <script> recibe, obligatoriamente el atributo language, para
especificarle al navegador el lenguaje Script a emplear, ya que además
de JavaScript hay VBscript, ActionScript etc.
Asegurarse de tener el navegador correctamente
configurado.
 documento para los estudiantes 7
Java Script

Sintaxis correcta para incluir código JavaScript

<html>

<head>

<title>

P&aacute;gina con JavaScript.

</title>

<script language=”javascript”>

<! - -

//-->

</script>

</head>

<body>

</body>

</html>
 documento para los estudiantes 8
Java Script

Los comentarios se definen <! - - //--> en el script se utiliza

para especificar al navegador que no soporta javaScript, se ignoren
las líneas de código de este lenguaje y no se produzca un error.

Otro tag : noscript

<noscript> </noscript>

Se usa para especificar al usuario que su navegador no soporta

javascript, y que por tanto su página no funcionará correctamente.

<html>

<head>

<title>

P&aacute;gina con JavaScript.

</title>

<script language=”javascript”>

<! - -

//-->

</script>

<noscript>

Por favor actualice su navegador, no soporta java

script

</noscript>
 documento para los estudiantes 9
Java Script

</head>

<body>

</body>

</html>

Nuestro Primer Script

<html>

<head>

<title>

P&aacute;gina con JavaScript.

</title>

<script languaje = javascript">

<!--

alert ("Hola desde java script");

alert (1234); // da lo mismo si el número se representa entre

comillas o número

//-->

</script>

</head>

<body>
 documento para los estudiantes 10
Java Script

esto es el cuerpo de la p&aacute;gina.

</body>

</html>

El aspecto del cuadro de aviso entre los do navegadores, varía un

poquito.
 documento para los estudiantes 11
Java Script

Los errores los puede ver por herramientas/consola de errores

Cada instrucción deberá ir en una línea física sin pulsar la tecla

enter. Caso contrario dará error.

Comentarios: // o /* */

Otra manera de Introducir JavaScript

Suponga que tiene un script muy grande (500 líneas), y el mismo
código lo tiene que incluir en 10 lugares, significarían 5000 líneas de
código JavaScript, con el fin de reducir el tamaño del código que
tiene que bajar del servidor al cliente, se debe hacer lo siguiente:

El código requerido ponerlo en un archivo con extensión .js

Para insertar el código añadir al tag <script> el atributo src=
“ ruta del script”, y el atributo type=”text/javascript”

Segundo script (segundo programa)

<html>

<head>

<title>

P&aacute;gina con JavaScript.

</title>

<script src="saludo.js"

languaje = "javascript" type="text/javascript">

</script>

</head>
 documento para los estudiantes 12
Java Script

<body>

esto es el cuerpo de la p&aacute;gina.

</body>

</html>

Los resultados deben ser los mismos del ejercicio anterior.

Variables y Tipos de Datos

La declaración puede ser explícita e implícita

Declaración explícita

var nombrevariable;

Declaración implícita

Ejemplo: (tercer programa)

<html>

<head>

<title>

P&aacute;gina con JavaScript- definición de variables

</title>

<script languaje = "javascript" >

var v1=20,v2=40; //declaración explicita

v3=50; //declaración implícita

 documento para los estudiantes 13
Java Script

alert("Declaradas implícitamente\nv1="+v1+"\n
V2="+v2+"\nDeclaradas implícitamente\nv3="+v3);

</script>

</head>

<body>

esto es el cuerpo de la p&aacute;gina.

</body>

</html>Los resultados serán:

Reglas para definir los nombres de las variables

No comenzar por número, solo por letra.
Podrán contener números, letras y guión bajo, pero ningún
otro signo.
No contendrán letras acentuadas ni ñ,
No contendrán espacios en blanco.
No usar palabras reservadas de javascript.
Sensibilidad entre mayúsculas y minúsculas.
 documento para los estudiantes 14
Java Script

Ejemplo usando tipos de variables:

var nombre=”Marisol Tenemaza”;

var numero=20;

Concatenar strings -> carácter +

Secuencias de escape: para definir strings y desplegarlos.

\\ Inserta un contraslash
\” Inserta comillas
\’ Inserta una comilla simple
\n Salto de línea
\f Salto de página
\r Retorno de carro
\t Inserta una tabulación
\b Retrocede un caracter

var saludo=”este aviso dice \”Hola\””;

var variable=”esto es el inicio del texto, \t y esto está tabulado”;

var variable2=’este es un texto delimitado por comillas simples.

Operaciones Numéricas
Operador acción
 documento para los estudiantes 15
Java Script

+ suma
- resta
* multiplicación
/ división
% Módulo (división entera)
devuelve l residuo
++ incremento
-- decremento

var numero1=10, numero2=20, suma;

suma=numero1+numero2;

suma+=numero2;

Los números fraccionarios se pueden usar con la misma

facilidad que los enteros.

Var numero3=2.5;

Los incrementos y decrementos, deben tenerse cuidado si son

pre decrementos o post incrementos.

var v1=10, v2;

v2=v1++; // post incremento v2=10, v1=11

v2=++v1; //pre increment v2= 11 y v1=11

Precedencia de operadores:

++ - -
 documento para los estudiantes 16
Java Script

* / %

+ -

La jerarquía se puede alterar con el uso de ( )

Si tienen igual jerarquía se ejecutan de izquierda a derecha

Ejercicio: (cuarto programa)

Calcular : b2-4ac, probas divisiones sucesivas, incrementos

y decrementos.

<html>

<head>

<title>

Programa para uso de operadores aritméticos

</title>

<script languaje="javascript">

<!--

var a=10, b=20, c=4, resultado;

resultado= b*b-(4*a*c);

alert("Datos\n
a="+a+"\nb="+b+"\nc="+c+"\nResultados:\n"+resultado);

var v1=1000, v2=20,v3=2;

v4=v1/v2/v3;
 documento para los estudiantes 17
Java Script

alert("Probando divisiones
sucesivas:\n"+"\nv1="+v1+"\nv2="+v2+"\nv3="+v3+"\nResultados:
"+v4);

v1=10;

v2=0;

alert("Probando incrementos y
decrementos\n"+"v1="+v1+"\nv2="+v2);

v2=v1++;

alert("Probando v2=v1++\n"+"v1="+v1+"\nv2="+v2);

v2=++v1;

alert("Probando v2=++v1\n"+"v1="+v1+"\nv2="+v2);

//-->

</script>

</head>

</html>
 documento para los estudiantes 18
Java Script

Otras formas de expresar datos numéricos

Datos numéricos Ejemplo
Exponenciales var datoExponencial=23E2;
Hexadecimal var datoHexadecimal=0xFF;
Octal Var datooctal 023;
Ejercicio: (quinto programa)

Probando otras formas de representación de números.

<html>

<head>
 documento para los estudiantes 19
Java Script

<title>

P&aacute;gina para probar otras definiciones de números

</title>

<script languaje="javascript">

<!--

var datoexponencial= 12E2, datohexadecimal= 0xFF,

datooctal=023;

alert("Dato exponencial="+ datoexponencial+"\n dato

hexadecimal="+datohexadecimal+"\ndato Octal="+datooctal);

//-->

</script>

</head

<body>

probando desde el body del html

</body>

</html>
 documento para los estudiantes 20
Java Script

Determinar el tipo de una variable

Función typeof( )

Cambiar el tipo de una variable

El cambio de tipo de variable puede ser implícita o explícita.

Implícita:

Primera forma

var dato=” cadena”; el cambio será implícito, si se despliega el

dato=1234; tipo el primero será string y el segundo

será number

Segunda forma

var dato=”1234”; En este caso, también dato queda

automáticamente, cambiado a número.

dato*=1; En este caso hay que tener cuidado cuando el

texto tiene letras intermedias, convierte
pero el resultado es incorrecto

Por ejemplo si var dato=12a3; en este caso la conversión es

incorrecta.

Explícita:

var miVariable=”123.45”;

miVariable= parseFloat(miVariable);
 documento para los estudiantes 21
Java Script

// Tener cuidado si hay letras intermedias, en ese caso convierte

los primeros números y a partir de la letra
hacia delante es ignorado.

Ejemplo:

Var miVariable=”123ª345”;

miVariable=parseFloat(miVariable); //el resultado sería 123. Y el

tipo es number, a pesar de que fue definida
como string.

Funciones aquí aprendidas

typeof()
parseFloat(dato)
parseInt(string)
toString()

Para convertir de un numérico a un decimal usamos toString();

Ejercicio (sexto programa)

// aplicación de la función typeof(), cambio explícito de tipos

toString(), parsefloat(), cambio implícito de
tipos

<html>

<head>

<title>
 documento para los estudiantes 22
Java Script

P&aacute;gina para probar typeof,cambios implícitos y explícitos

de tipos.

</title>

<script languaje="javascript">

<!--

// cambio implícito

var dato="cadena";

alert ("El contenido de 'dato' es: "+ dato+ " y su tipo es "+
typeof(dato));

dato=1234;

alert ("El contenido de 'dato' es: "+ dato+ " y su tipo es "+
typeof(dato));

//cambio implícito con cuidado

var dato1="12345";

alert ("El contenido de 'dato1' es: "+ dato1+ " y su tipo es "+
typeof(dato1));

dato1*=1;
 documento para los estudiantes 23
Java Script

alert ("El contenido de 'dato1'desplues de aplicar dato1*1 es: "+

dato1+ " y su tipo es "+ typeof(dato1));

// cambio explícito

var dato2="12.45";

alert ("El contenido de 'dato2' es: "+ dato2+ " y su tipo es "+
typeof(dato2));

dato= parseFloat(dato2);

alert ("El contenido de 'dato2', despues de aplicar

parsefloat(dato2) es: "+ dato2+ " y su tipo es
"+ typeof(dato2));

//cambio explícito

var dato3=12.45;

alert ("El contenido de 'dato3' es: "+ dato3+ " y su tipo es "+
typeof(dato3));

dato3=dato3.toString();

alert ("El contenido de 'dato3', después de aplicar dato3.toString()

es: "+ dato3+ " y su tipo es "+ typeof(dato3));
 documento para los estudiantes 24
Java Script

//cambio de bases

var dato4=1839;

alert ("El contenido de 'dato4' es: "+ dato4+ " y su tipo es "+
typeof(dato4));

dato4=dato4.toString(16);

alert ("El contenido de 'dato4' luego de aplicar dato4.toString(16)

es: "+ dato4+ " y su tipo es "+ typeof(dato4));

//-->

</script>

</head

<body>

probando desde el body del html

</body>

</html>
documento para los estudiantes 25
Java Script
 documento para los estudiantes 26
Java Script

Datos booleanos y lógicos

var booleana1=true, booleana2=false;

Variables indefinidas y nullas.

Una variable es indefinida, cuando no se inicializa;
 documento para los estudiantes 27
Java Script

var dato;

alert(typeof(dato)); en este caso desplegará dato indefinido.

Reasignación dinámica de variables

Más adelante veremos como pasar variables desde el html hasta el
javascript y viceversa.

Ingreso de datos, mediante la función prompt.

prompt("mensaje","respuesta por defecto")

devuelve un string.

Ejercicio: (septimo ejercicio)

<html>

<head>

<title>

P&aacute;gina para probar entrada y salida.

</title>

<script languaje="javascript">

<!--

var nombre,ciudad, sueldo;

nombre=prompt("Escriba su nombre", " ");

ciudad=prompt("Escriba el nombre de la ciudad donde

vive","Quito");

sueldo=parseFloat(prompt("Cuál es su sueldo:"," "));

 documento para los estudiantes 28
Java Script

alert(nombre + " usted vive en "+ ciudad+" y su sueldo es: "+sueldo);

//-->

</script>

</head

<body>

probando desde el body del html

</body>

</html>
 documento para los estudiantes 29
Java Script

Funciones de ingreso y despliegue aprendidas hasta aquí

Alert(texto);
prompt("mensaje","respuesta por defecto")
 documento para los estudiantes 30
Java Script

Estructuras de Control

Condicionales
Las condiciones pueden ser simples, o anidadas.

if(condición)

….

else

Operadores Condicionales
Operadores significado
> Mayor que
>= Mayor o igual que
< Menor que
<= Menor o igual que
== igual
!= Not igual
=== Exactamente igual
!== Not exactamente igual
&& And
|| OR
 documento para los estudiantes 31
Java Script

Aclaraciones a las condiciones:

El operador de igualdad estricta o exactamente igual, veamos

que significa “exactamente igual”, JavaScript no es un
absoluto, significa que ciertas comparaciones podrían dar
verdad aunque no lo sean, por tanto hay que convertir (usar
parseInt, parseFloat, ..) con igualdad estricta aseguro que
compare incluso los tipos.
En javaScript es posible comparar directamente cadenas, la
comparación es carácter a carácter y considerando la
representación ASCII. Por ejemplo: if(nombre==”Juanito”),
esto por ejemplo no puede hacerse en los lenguajes tipados,
que son los de alto nivel.
Si comparamos if(“abcd”>”ABCD”) la respuesta sería
verdadera puesto que el código ASCII de los caracteres
minúsculas es mayor, que el código ASCII de las mayúsculas.
Para comprobar valores, booleanos, no hace falta preguntar
por true o false, la siguiente pregunta es errónea
if (dato==true) esto en JavaScript es error, debe preguntar
if(dato) es lo mismo que preguntar si dato es igual a true, esta
es la forma correcta.

Operador ternario ?

(condición)? valor1:valor2;

Instrucción switch
 documento para los estudiantes 32
Java Script

switch(expresión)

case valor1:

break;

case valor2:

break;

case valor n:

break;

default:

Bucles
for

for(inicialización;condición;incremento/decremento)

while

while(condición)

{
 documento para los estudiantes 33
Java Script

do…while

do

}while(condición);

Explicación adicional:

Si se produce algún bucle infinito, y en el contexto del bucle no hay

interacción con el usuario el browser emite un mensaje. “Script sin
respuesta”, detener Script.

Instrucción adicional a usarse:

confirm(“mensaje);

Permite presentar un mensaje, con dos botones (aceptar y

cancelar), devuelve un true o false. Si devuelve true significa
que presionó aceptar, lo inverso para cancelar.

Ejercicio:

1. Escriba un script que le permita solicitar un número cada

vez y sumar los dígitos del número.
 documento para los estudiantes 34
Java Script

La POO y el DOM

La POO
En una página Web existen imágenes tablas, botones, formularios,
capas, cada uno de ellos lo veremos como un objeto.

Los objetos tienen identidad propia y se definen y se manejan

mediante tres aspectos:

Propiedades: características del objeto.

Métodos: funciones específicas que cada objeto puede llevar a

cabo.

Eventos: sucesos que pueden llegar a producirse o no. JavaScript

reconoce cuando tiene lugar un evento y se puede programar una
respuesta. Por ejemplo se puede detectar si el usuario apoya el
puntero sobre una imagen o si pulsa el botón derecho o si pulsa una
tecla.

Como usar:

Objeto.propiedad

Objeto.método( [argumentos]);

Ejercicio 1POO.

//Probando el uso de objetos, atributos y métodos, y un objeto

HTML, sobre un evento.

<html>

<head>
 documento para los estudiantes 35
Java Script

<title>

P&aacute;gina que demuestra la primera aplicacion de POO

</title>

<script languaje="javascript">

<!--

alert("pulse aquí para ver su página en rojo");

//document.bgColor = "red";

//document.fgcolor="yellow";

document.write ("Esto está escrito en el documento");

document.write("\n Esto también "); //los caracteres\n no son

tomados en cuenta

for(i=1;i<10;i++)

document.write(i+"---");

document.write("<br><br>Uso de salto con tag html<br>");

for( i=0; i<10;i++)

{
 documento para los estudiantes 36
Java Script

document.write(i+"<br>"); // el tag <br> es de html el

javascript lo reconoce y lo interpreta

document.write("<br><br><b>Esto es negrita. </b><br>");

//uso de tags de html embebido en javascript

document.write("<i>Esto es cursiva. </i><br>");

document.write("<u>Esto es subrayado. </u><br>");

document.write("<h1>Esto es grande. </h1><br>");

document.write("<b>ALFA</b>"); //bloque para observar la

diferencia entre doccument.write y document.writeln

document.write("<b>BETA </b><br>");

document.writeln("<br><b>ALFA</b>");

document.write("<b>BETA</b><br>");
 documento para los estudiantes 37
Java Script

//-->

</script>

</head>

<body> // vamos a probar un evento sobre un objeto HTML

(button) probando el evento onClicK

<button onClick=
"document.bgColor='red';document.fgColor='skyblue';">

pulse para cambiar los colores.

</button>

</body>

</html>
 documento para los estudiantes 38
Java Script

EL DOM DE JAVASCRIPT
En el tema anterior revisamos que la POO es un concepto, una idea,
lo importante es como JavaScript hace uso de ella.Cada lenguaje
tiene su propio modelo de uso de los conceptos de la POO y a
nosotros lo que nos interesa realmente conocer es el DOM de
JavaScript.

DOM significa Document Object Model (Modelo de Objetos del

documento)

En este capítulo aprenderemos a conocer el DOM de la POO en

JavaScript.

La Jerarquía de Objetos:
En JavaScript, existe una organización jerárquica de objetos, por
lo que existen objetos con mayor nivel jerárquico que otros, así:
(este es un esquema básico, en realidad hay muchos objetos )

window

document frames history location

anchors layers images forms

fields
 documento para los estudiantes 39
Java Script

Window es la ventana en la que está abierto el navegador y cargada

una página, este es el objeto más importante.

Document es el documento activo, la página que se está ejecutando

en ese momento.

javaScript permite omitir window, podría escribirse

window.document.bgColor=”red”;

document.bgColor=”red”;

Abreviando Código

Una de las metas de un buen webMaster es ecribir código eficiente

y compacto y por supuesto que funcione correctamente, y que sea
cómodo para el usuario.

Cuando se tiene varias líneas refiriendo al mismo objeto, se debe

usar la función with(), así:

document.write("<br><br><b>Esto es negrita. </b><br>");

document.write("<i>Esto es cursiva. </i><br>");

document.write("<u>Esto es subrayado. </u><br>");

document.write("<h1>Esto es grande. </h1><br>");

Puede escribirse:

with(document)

write("<br><br><b>Esto es negrita. </b><br>");

 documento para los estudiantes 40
Java Script

write("<i>Esto es cursiva. </i><br>");

write("<u>Esto es subrayado. </u><br>");

write("<h1>Esto es grande. </h1><br>");

Eventos fundamentales en JavaScript

En JavaScript la mayor parte de eventos que se manejan pueden ir
asociados a distintos tipos de objetos, por ejemplo el evento
onClick podría asociarse a una imagen, para detectar si el usuario
hace clic sobre la misma.

Así mismo hay eventos que solo pueden asociarse a ciertos objetos,
por ejemplo el evento onLoad, que detecta cuando ha terminado de
cargarse una imagen o una página, solo puede incluirse con:

El tag <body> asociado a una página.

El tag <img> asociado a una imagen.

El Evento onLoad

Se dispara cuando la página se ha cargado

Programa1 EventosJS

<html>

<head>

<title>
 documento para los estudiantes 41
Java Script

P&aacute;gina que demuestra la primera aplicacion de Eventos

</title>

<script languaje="javascript">

<!--

//-->

</script>

</head>

<body onLoad="alert('La Página ya se ha cargado');">

<h1>

Esta p&aacute;gina es muy peque&ntilde;a

<br>

y no necesita este evento

</h1>

</body>

</html>
 documento para los estudiantes 42
Java Script

El evento onMouseover:

Permite detectar cuando se apoya el puntero del ratón sobre un

objeto determinado de la página (texto, imagen etc).

Para asociar el evento al texto, este debe estar delimitado por

tags de HTML </h1>, <p>, <Font> <div> </div> usados como
delimitadores de fragmentos de una página.
 documento para los estudiantes 43
Java Script

Programa2EventosJS

<html>

<head>

<title>

P&aacute;gina que demuestra la primera aplicación de Eventos

</title>

<script languaje="javascript">

<!--

//-->

</script>

</head>

<body>

<h1 onMouseOver="alert ('El puntero se ha apoyado en el texto');">

Este texto detecta cuando se apoya el puntero

</h1>

<br><br><br><br>

<h1>

En cambio, este texto no detecta nada.

</h1>
 documento para los estudiantes 44
Java Script

</body>

</html>

El evento onMouseOut

Detecta a que momento el puntero más se separa del objeto.

Programa3EventosJS

<html>

<head>

<title>
 documento para los estudiantes 45
Java Script

P&aacute;gina que demuestra la primera aplicacion de Eventos

</title>

<script languaje="javascript">

<!--

//-->

</script>

</head>

<body>

<h1 onMouseOut="alert ('El puntero ha salido del texto');" >

Este texto detecta cuando se apoya el puntero

</h1>

<br><br><br><br>

<h1>

En cambio, este texto no detecta nada.

</h1>

</body>

</html>
 documento para los estudiantes 46
Java Script

El evento onUnload

Se ejecuta cuando el usuario abandona la página que está cargando

en ese momento.

Programa4EventosJS

<html>

<head>

<title>

P&aacute;gina que demuestra la primera aplicacion de Eventos

</title>
 documento para los estudiantes 47
Java Script

<script languaje="javascript">

<!--

//-->

</script>

</head>

<body onUnload="alert('Vuelva a visitarnos pronto');">

<br><br><br><br>

<h1>

cierre ahora el navegador.

</h1>

</body>

</html>
 documento para los estudiantes 48
Java Script

Probando los dos eventos onLoad y unOnload

Cambios sobre programa4EventosJS

<html>

<head>

<title>

P&aacute;gina que demuestra la primera aplicacion de Eventos

</title>

<script languaje="javascript">

<!--
 documento para los estudiantes 49
Java Script

//-->

</script>

</head>

<body onLoad="alert('bienvenidos a esta

página');",onUnload="alert('Vuelva a visitarnos pronto');">

<br><br><br><br>

<h1>

cierre ahora el navegador.

</h1>

</body>

</html>
documento para los estudiantes 50
Java Script
 documento para los estudiantes 51
Java Script

Trabajo para la primera semana

Estimados estudiantes, el trabajo colaborativo es enriquecedor,

si ustedes pueden compartir conocimiento, lo deben hacer, los
procesos actuales de enseñanza aprendizaje requieren que el
estudiante aprenda a aprender, construya conocimiento e
interactué con sus compañeros de tal manera que se interiorice
el conocimiento.

La tarea debe hacerse en grupo de tres personas, consiste en

construir el siguiente java script:

1. Escriba una aplicación web, que solicite una cédula y la valide,

el proceso deberá desplegar los siguientes mensajes:
a. La cédula es correcta.
b. El dígito autoverificador de la cédula es incorrecto,
debe ser ……

El proyecto deberá ser presentado, en un archivo PDF, el archivo

contendrá el código del programa, una explicación de la lógica y los
resultados.

El grupo deberá crear un blog llamado Tareas JavaScript, esta

entrada se llamará Primera tarea, en ella deberá estar publicado
 documento para los estudiantes 52
Java Script

el trabajo, pueden publicarlo directamente o usar cualquier recurso

web 2.0.

El trabajo será brevemente expuesto en los primeros minutos de la

siguiente clase.

En la exposición los participantes deberán explicar que parte del

trabajo lo construyeron, es decir en que consistió el auto
aprendizaje y la construcción del conocimiento.

Buena suerte!!
 documento para los estudiantes 53
Java Script

Bibliografía:

Domine Java Script, José lopez Quijado, AlfaOmega 2007

Apoyo de libros gratuitos bajados de Internet.