You are on page 1of 16

TECNOLGICO NACIONAL DE MXICO

INSTITUTO TECNOLGICO DE MATEHUALA

Reporte. Ejemplos JavaScript. Unidad 2

ALUMNO: Molina Esparza Eduardo Enrique


MATERIA: Programacin Web
CARRERA: Ingeniera en Sistemas Computacionales
SEMESTRE: Sptimo
PERIODO: Agosto-Diciembre
DOCENTE: Martha Coronado

INSTITUTO TECNOLGICO DE MATEHUALA


NDICE Pgina
1. INTRODUCCIN ......................................................................................................................... 3

2. DESARROLLO ............................................................................................................................ 4

2.1 Ejemplo 1. Recoger Datos Por Teclado ......................................................................... 4

2.2 Ejemplo 2. Reloj Digital ...................................................................................................... 5

2.3 Ejemplo 3. Galera de Imgenes ...................................................................................... 7

2.4 Ejemplo 4. Mostrar Mensaje Complejo .......................................................................... 8

2.5 Ejemplo 5. Visualizar el Nombre de Cada Mes ............................................................ 9

2.6 Ejemplo 6. Operaciones Bsicas ................................................................................... 10

2.7 Ejemplo 7. Evento del Ratn (Coordenadas) ............................................................. 11

2.8 Ejemplo 8. Mostrar Mensaje al Dar Click ..................................................................... 13

2.9 Ejemplo 9. Validacin de un Formulario ..................................................................... 14

2.10 Ejemplo 10. Abrir y Cerrar una ventana .................................................................... 15

3. CONCLUSIN ........................................................................................................................... 16

4. REFERENCIAS .......................................................................................................................... 16
1. INTRODUCCIN

JavaScript es un lenguaje de programacin Script, creado por la empresa Netscape,


y cuya principal funcin es incluir contenido dinmico a las pginas web.

Los lenguajes Script sirven principalmente para aadir contenido dinmico a las
pginas Web. El contenido dinmico es, bsicamente, aquel contenido de una
pgina Web (grficos, textos y dems) que puede cambiar en el tiempo, segn las
iteraciones que realiza el usuario a lo largo de su ejecucin.

En una pgina Web HTML que no contiene cdigo Script el contenido no puede
cambiar a lo largo del tiempo, es por eso que al contenido que contiene, valga la
redundancia, se le llama esttico.

En este documento se muestran diez ejemplos realizados con JavaScript con la


finalidad de practicar sobre este lenguaje y conocer algunas de sus caractersticas
bsicas. Se document su cdigo al igual que su funcin o ejecucin en el
navegador Microsoft Edge con capturas de pantalla.
2. DESARROLLO

2.1 Ejemplo 1. Recoger Datos Por Teclado

El siguiente ejemplo muestra cmo se puede tomar un dato mediante el teclado y guardarlo
a travs de la funcin prompt de Java Script
2.2 Ejemplo 2. Reloj Digital

ste ejemplo nos muestra un reloj digital que se va actualizando cada 500 milisegundos.
Se crea un intervalo de ejecucin de 500 milisegundos de la funcin Ver_Hora .

Ver_Hora()recoge la hora, la formatea con la representacin hh:mm:ss (hora, minutos,


segundos) y la visualiza dentro del objeto del html, identificado con el nombre de mireloj.
Dicho objeto, se encuentra dentro del documento de html, a su vez en el nico formulario
existente y definitivamente en un botn en forma de texto .

Es por esto que al referenciarlo para escribir en l la hora JavaScript lo haga de la siguiente
forma:

document.forms[0].mireloj.value

Si hubiera otro formulario en la pgina que lo contuviera sera de la siguiente manera:

document.forms[0].mireloj.value

Esto es lo que se denomina anidamiento de objetos (dentro de unos hay otros).


2.3 Ejemplo 3. Galera de Imgenes

El siguiente ejemplo muestra una galera creada a partir de la funcin document.images,


Se definieron 4 imgenes para la galera, tomadas del equipo. Se cre un men que
contiene las opciones para visualizar las imgenes, as como sus respectivos parmetros.
2.4 Ejemplo 4. Mostrar Mensaje Complejo

Este ejemplo nos muestra cmo se pueden visualizar mensajes complejos utilizando
distintos renglones dentro del recuadro de mensaje. Es un ejemplo sencillo pero podra ser

til al momento de querer mandar una alerta o recomendacin al usuario si fuera necesario.
2.5 Ejemplo 5. Visualizar el Nombre de Cada Mes

Para realizar ste ejemplo se utiliz un array, el cual almacena los nombres de todos los
meses de ao, esto para ser llamados mediante el uso de alert que, como se ha visto a lo
largo del reporte de prctica, es donde se muestra el mensaje que se quiere visualizar.

Luego de almacenar los meses en el arreglo se llaman conforme su posicin en el ndice.


2.6 Ejemplo 6. Operaciones Bsicas

El ejemplo de operaciones muestra el uso de los operadores bsicos dentro de un


programa, se realizan la suma, resta, multiplicacin y divisin con valores establecidos, o
estticos. Esto para luego ser visualizados en cajas de mensajes.
2.7 Ejemplo 7. Evento del Ratn (Coordenadas)

Este ejemplo muestra las coordenadas X y Y de la ventana del navegador dnde est
posicionado y conforme se va moviendo de lugar se actualiza la informacin al mismo
tiempo. Es un ejemplo sencillo aunque el cdigo para realizarlo es largo.
Es importante mencionar que en ste ejemplo, al momento de dar click con el mouse, se
cambian los colores de fondo de las pginas, como se muestra a continuacin:
2.8 Ejemplo 8. Mostrar Mensaje
al Dar Click

El ejemplo siguiente es uno de los ms


sencillos ya que slo se visualiza un mensaje al dar click en
un botn. El mtodo se defini como
alertUser() el cual contiene el cuadro de
mensaje.
2.9 Ejemplo 9. Validacin de un Formulario

Este ejemplo realiza una validacin que corresponde a un rango de nmeros, del 1 al 5. Se
utiliza la instruccin de condicin en la cual, si no se escribe un nmero que est dentro del
rango muestra un mensaje.
2.10 Ejemplo 10. Abrir y Cerrar una ventana

El siguiente ejemplo realiza dos funciones que son abrir y cerrar una nueva ventana del
navegador. Esto funciona con el mtodo de window.open, Se utilizan dos botones, a los
que se les definen las funciones que deben realizar. Tambin se establecen las medidas
de la nueva ventana.
3. CONCLUSIN
En primer lugar, JavaScript no tiene nada que ver con el lenguaje de programacin
Java. JavaScript es un lenguaje de scripting basado en el navegador que ejecuta
el cdigo del lado del cliente. Esto significa que cualquier cdigo que se escribe en
JavaScript se entrega desde el servidor junto a las pginas web, y todo el cdigo se
ejecuta desde el navegador del usuario (en el dispositivo del usuario) en lugar de
hacerlo directamente en el servidor donde se encuentra la pgina web.

JavaScript es una excelente solucin para poner en prctica la validacin de datos


de un formulario en el lado del cliente. Si un usuario omite escribir su nombre en un
formulario, una funcin de validacin en JavaScript puede desplegar en pantalla un
mensaje popup para hacerle saber al usuario acerca de la omisin. Este tipo de
funcionalidades son ms ventajosas que tener una rutina de validacin del lado del
servidor para controlar el error, dado que el servidor en ste caso no tiene que
hacer ningn tipo procesamiento de informacin adicional. Una rutina de ASP o PHP
podra ser escrita para lograr la misma tarea pero un formulario desarrollado en
JavaScript no permitira que la informacin se enviase a menos que se complete
correctamente el formulario.
Una de las reas en la que sobresale radicalmente JavaScript es en la creacin de
efectos dinmicos tales como imgenes dinmicas y presentaciones de
diapositivas, donde su uso se ha convertido algo comn hoy en da. Debido a que
JavaScript se ejecuta dentro del navegador de los clientes, se puede utilizar para
cambiar el aspecto de la pantalla en el dispositivo de los usuarios despus que la
pgina ha sido enviada por el servidor. Esto le permite al desarrollador web crear
efectos dinmicos muy impresionantes mejorando as la experiencia que recibe un
usuario momento de entrar a un sitio web.

4. REFERENCIAS
http://recursostic.educacion.es/observatorio/web/gl/software/programacion/4
90-lorena-arranz

http://librosweb.es/libro/javascript/capitulo_1.html

La Biblia de JavaScript Golden Edition, Danny Goodman