Scribd
Cargar
76 vistas

Javascript

1) JavaScript es un lenguaje de programación orientado a documentos que se utiliza principalmente para mejorar páginas web. 2) El documento describe las normas básicas de codificación en JavaScript como colocar todo el código dentro de funciones y entre etiquetas <script>. 3) También explica el uso de funciones, ventanas de alerta, eventos y algunos ejemplos básicos de programas en JavaScript.

Cargado por

mauroc79
Derechos de autor
© Attribution Non-Commercial (BY-NC)
Formatos disponibles
Descarga como PPT, PDF, TXT o lee en línea desde Scribd
76 vistas

Javascript

1) JavaScript es un lenguaje de programación orientado a documentos que se utiliza principalmente para mejorar páginas web. 2) El documento describe las normas básicas de codificación en JavaScript como colocar todo el código dentro de funciones y entre etiquetas <script>. 3) También explica el uso de funciones, ventanas de alerta, eventos y algunos ejemplos básicos de programas en JavaScript.

Cargado por

mauroc79
Derechos de autor
© Attribution Non-Commercial (BY-NC)
Formatos disponibles
Descarga como PPT, PDF, TXT o lee en línea desde Scribd
Está en la página 1/ 102

INTRODUCCIN

JavaScript es una de las mltiples aplicaciones que han surgido para extender las capacidades del Lenguaje HTML. JavaScript es un lenguaje script orientado a documento. Nunca podr hacer un programa, tan slo podr mejorar sus pginas Web.

Diplomado en Tecnologa JAVA

NORMAS DEL CODIGO EN JAVASCRIPT


Las normas para poder escribir cualquier cdigo de JavaScript se basan en 5 puntos bsicos y que debemos cumplir siempre. Estas normas son las siguientes:

1.

Todo el cdigo (sentencias) esta dentro de funciones.

2. Las funciones se desarrollan entre las etiquetas <script> y </script>.

3. Las etiquetas <script> deben colocarse entre las etiquetas <head> y </head>.
4. Las etiquetas <title> no pueden estar colocadas entre las de <script>. 5. La llamada a la funcin se hace a travs de un evento de un elemento del documento.
Diplomado en Tecnologa JAVA

USO DE FUNCIONES

Las funciones son un conjunto de sentencias (bloque de cdigo) que especifica al programa las operaciones a realizar. Son tiles para evitar la repeticin de lneas y modular el cdigo. Para trabajar con ellas hay que desarrollarlas y llamarlas cuando lo necesitemos.

SINTAXIS DEL DESARROLLO: function nombre_funcion([var1,var2,varN]) { sentencia(s); }


Diplomado en Tecnologa JAVA

SINTAXIS DE LA LLAMADA:
<elemento evento=nombre_funcion([val1,val2,valN]);>

nombre_funcion(valor1,valor2,valorN);

En el primero de los casos la llamada se realiza desde un elemento del documento. En el segundo caso la llamada se realiza desde el interior de otra funcin que tambin es posible.

Diplomado en Tecnologa JAVA

LA VENTANA ALERT

Se trata de una ventana estndar que usamos para mostrar informacin en pantalla. Se puede mostrar texto, variables y texto en conjunto con variables. El diseo de la ventana ya esta definido lo nico que podemos hacer es mostrar la informacin en una o varias lneas. Su diseo y sintaxis es:

SINTAXIS:

alert(texto de la ventana); alert(variable);


Diplomado en Tecnologa JAVA

alert(texto+variable);

PRIMER PROGRAMA
Ahora vamos paso a paso a construir nuestro primer programa, y as podremos ver los elementos principales del lenguaje y su colocacin dentro del documento Web. Solo debemos seguir la teora vista en los temas anteriores. EJEMPLO 1: Llamada a una funcin desde un elemento del documento.

<html><head><script>
function hola(){ alert("Hola a todos los participantes"); } </script> <title>Autor:Curso Titulacin</title></head> <body onLoad=hola();></body> </html>
Diplomado en Tecnologa JAVA

EJEMPLO 2: Llamada a una funcin desde otra.

<html><head>

<script>
function hola() {

alert("Hola a todos los participantes"); rehola(); } function rehola(){

alert(hola de nuevo a todos);


} </script> <title>Autor: Curso Titulacin </title></head> <body onLoad=hola();></body></html>
Diplomado en Tecnologa JAVA

EVENTOS

Un evento es un mecanismo por el cual podemos detectar las acciones que realiza el usuario y llamar automticamente a la funcin que tengamos asociada. Desde esta funcin realizaremos las acciones que tengamos desarrolladas.

SINTAXIS:
<elemento nombre_evento = nombrefuncion([parametros]);>

Diplomado en Tecnologa JAVA

La siguiente tabla muestra los eventos y manipuladores de JavaScript:

EVENTO onLoad

SE PRODUCE AL.. Terminar de cargar una pgina o frame (entrar). Abortar la carga de una pgina. Producirse algn error en la carga de la pgina. Pasar el ratn por encima de un enlace, Diplomado en Tecnologa JAVA area o frame.

onAbort onError

onMouseOver

EVENTO

SE PRODUCE AL..

onMouseOver

Pasar el ratn por encima de un enlace, area o frame. Dejar de estar el ratn encima de un enlace, area o frame. Mover el ratn por el documento.
Presionar una tecla. Hacer click con el ratn.
Diplomado en Tecnologa JAVA

onMouseOut

onMouseMove
onKeyUp onClick

EVENTO onResize onMove onChange onSelect

SE PRODUCE AL.. Dimensionar la ventana del navegador. Mover la ventana del navegador. Modificar texto en un control de edicin. Sucede al perder el foco. Seleccionar texto en un control de edicin. Situar el foco en un control.
Diplomado en Tecnologa JAVA

onFocus

EVENTO onBlur

SE PRODUCE AL.. Perder el foco un control.

onSubmit onReset

Enviar un formulario. Inicializar un formulario.

Diplomado en Tecnologa JAVA

EJEMPLO 1:
<html> <head> <script> function hola(){alert("Hola a todos");} function adios(){alert("Adios a todos");} </script> <title>Autor: Curso Titulacin </title> </head>

<body onLoad=hola(); onUnload=adios();> </body> </html>


Diplomado en Tecnologa JAVA

EJEMPLO 2:

<html> <head> <script> function pulsa(){alert("Autor:CURSO TITULA");} function foco(){alert("Foco en la primera Caja");} function tecla(){alert("Pulsada tecla");} </script>
<title>Autor:Curso Titulacin</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>

Diplomado en Tecnologa JAVA

EJEMPLO 3:
<html> <head> <script> function cambio(){alert("Cambiado el tamao");} </script> <title>Autor:Curso Titulacin</title> </head>

<body onResize=cambio();> </body> </html>


Diplomado en Tecnologa JAVA

VARIABLES Y CONSTANTES
VARIABLES:
Espacio de memoria con un nombre reservado para guardar informacin mientras la pgina este cargada. El primer paso para poder trabajar con variables es declararlas, que es lugar donde se les da su nombre y su mbito.

Diplomado en Tecnologa JAVA

Para dar nombre a una variable debemos tener en cuenta las siguientes normas:

1. No pueden contener espacios.


2. Distingue entre maysculas y minsculas.

3. No pueden contener acentos, puntos o cualquier signo gramatical.


4. No pueden comenzar con un dgito ni contener la letra . 5. Nombre nico y exclusivo para cada variable salvo que estn en 2 funciones distintas.

Diplomado en Tecnologa JAVA

El mbito de una variable define si la variable se podr utilizar en cualquier parte del documento (es global). O si solo se podr utilizar dentro de una funcin determinada (es local). La declaracin de las variables globales se realiza dentro de las etiquetas <script> pero fuera de cualquier funcin. La declaracin de las variables locales se realiza dentro de la funcin que nos interese usar esa variable. La sintaxis para declarar una variable es igual en ambos casos, la nica diferencia es el lugar donde las declaramos. La siguiente lnea nos muestra como hacerlo: var nombre_variable[=valor];

Diplomado en Tecnologa JAVA

El tipo de variable es asignado automticamente por JavaScript. Depende del primer valor que se guarde en la variable. Por tanto los tipos de variable existentes son los que mostramos en la siguiente tabla:
TIPO VALORES

numrica

Cualquier tipo numrico

boolean

True o False.

String

Texto o letra.

Diplomado en Tecnologa JAVA

Otro aspecto importante, es la conversin de datos, que en JavaScript es automtica. Transforma los datos de todas la variables en una expresin segn el tipo de la primera variable. No es muy segura y puede acarrear muchos problemas. EJEMPLO: num1=12; num2=10;

x=num1+num2; // daria como resultado 1210. y=num2+num1; // daria como resultado 22.
Diplomado en Tecnologa JAVA

Para evitar problemas en las conversiones, se pueden utilizar mtodos ya implementados que realizan la conversin de una manera ms segura.

TIPO DE CONVERSION

SINTAXIS

De texto a numero entero.

var_numerica=parseInt(var_texto);

De texto a coma flotante (decimal).

var_numerica=parseFloat(var_texto);

De numrica a texto.

Es automtica sin peligro.

Diplomado en Tecnologa JAVA

EJEMPLO: <html> <head> <script> var global=100; function uno() { var local_uno=1; alert("Global " +global + Local +local_uno); dos(); } function dos() { var local_dos=2; alert("Global " +global + Local +local_dos); } </script> <title>Autor:Curso Titulacin</title> </head> <body onLoad=uno();> </body> Diplomado en Tecnologa JAVA

</html>

CONSTANTES (literales) Los valores iniciales que se les asigna son invariables. Estos no son variables, sino expresiones constantes. Los tipos de literales son los mismos que en las variables, segn el primer dato que almacenemos ser de un tipo u otro. TIPO VALORES numrica boolean String Cualquier tipo numrico True o False. Texto o letra.
Diplomado en Tecnologa JAVA

OPERADORES
JavaScript define TRES tipos de operadores: aritmticos, relacionales y lgicos. Tambin hay definido un operador para realizar determinadas tareas, como las asignaciones.

Diplomado en Tecnologa JAVA

ASIGNACION (=)

En JavaScript se puede utilizar el operador de asignacin en cualquier expresin valida. Solo con utilizar un signo de igualdad se realiza la asignacin. El operador destino (parte izquierda) debe ser siempre una variable, mientras que en la parte derecha puede ser cualquier expresin valida. Es posible realizar asignaciones mltiples, igualar variables entre si y a un valor.
SINTAXIS:
variable=valor; variable=variable1;

variable=variable1=variable2=variableN=valor;
Diplomado en Tecnologa JAVA

ARITMTICOS

Pueden aplicarse a todo tipo de expresiones. Son utilizados para realizar operaciones matemticas sencillas, aunque unindolos se puede realizar cualquier tipo de operaciones. En la siguiente tabla se muestran todos los operadores aritmticos.
OPERADOR DESCRIPCIN
Resta. Suma Multiplica Divide Resto de una divisin Decremento en 1.

+ * / % --

++
vari+=valor vari-=valor vari*=valor

Incrementa en 1.
Incrementa el valor de vari ms valor. decrementa el valor de vari menos valor. Multiplica el valor de vari Diplomado en Tecnologa JAVA por valor.

LGICOS Y RELACIONALES Los operadores relacionales hacen referencia a la relacin entre unos valores y otros Los lgicos se refiere a la forma en que esas relaciones pueden conectarse entre si. Los veremos a la par por la estrecha relacin en la que trabajan.
OPERADORES RELACIONALES OPERADORES LGICOS

OPERADOR

DESCRIPCIN

OPERADOR

DESCRIPCIN

< > <= >= == ! =

Menor que. Mayor que. Menor o igual. Mayor o igual Igual Distinto

&& || !

Y (AND) O (OR) NO (NOT)

Diplomado en Tecnologa JAVA

INTRODUCCIN DE DATOS
JavaScript permite interactuar al usuario por medio de la introduccin de datos. La introduccin de datos se puede realizar por medio de la ventana prompt o utilizando controles como cajas de texto.

VENTANA PROMPT:

Diplomado en Tecnologa JAVA

SINTAXIS:
vari=prompt(Texto de la ventana,valor inicial caja);

Al pulsar el botn aceptar, el contenido de la caja pasa a vari. Si se pulsa el botn cancelar, el contenido de la caja se pierde y vari queda con valor null.

Diplomado en Tecnologa JAVA

EJEMPLO: <html> <head> <script> function valor() { var nombre; nombre=prompt("Introduce Nombre:",""); alert("hola "+nombre); } </script> </head> <body onload=valor();> </body> </html>
Diplomado en Tecnologa JAVA

CAJA DE TEXTO: Otro mecanismo por el cual se pueden introducir datos, es mediante las cajas de texto. Todo el trabajo con las cajas, esta basado en funciones y mtodos ya implementadas en JavaScript. Estas son las funciones que podemos utilizar:

FUNCIN

DESCRIPCIN

variable=nombre_caja.value;
nombre_caja.value=valor o variable; nombre_caja.value=; nombre_caja.sefocus();

Guarda el contenido de la caja


Muestra en la caja el valor. Limpia el contenido de la caja. Enva el foco a la caja.

Diplomado en Tecnologa JAVA

EJEMPLO: <html> <head> <script> function muestra() { var nombre=cnombre.value; alert("Eres "+nombre); cnombre.value=""; cnombre.focus(); } </script> </head> <body> Nombre:<input type="text" name="cnombre" size="20"> <input type="button" value="Ver" onClick=muestra();> </body> </html> Diplomado en Tecnologa JAVA

SENTENCIAS DE CONTROL
Es la manera que tiene JavaScript de provocar que el flujo de la ejecucin avance y se ramifique en funcin de los cambios y estado de los datos.

IF-ELSE:
La ejecucin atraviesa un conjunto de estados boolean que determinan que bloques de cdigo se ejecutan. Con la utilizacin de esta sentencia nunca se realizarn ambos bloques de cdigo. SINTAXIS: En caso de ser una sola sentencia por parte las llaves son opcionales. if (expresion-booleana) { Sentencia(s); } [else] { Sentencia(s); }
Diplomado en Tecnologa JAVA

EJEMPLO 1:

<html> <head> <script> function ver() { var edad=parseInt(cedad.value);


if(edad<=18) alert("No tienes acceso\nDebes tener 18"); else alert("Bienvenido a la pagina"); } </script> <title>Pagina nueva 1</title> </head>

<body> Edad:
<input type="text" name="cedad" size="3" onBlur=ver();>

</body> </html>
Diplomado en Tecnologa JAVA

EJEMPLO 2:

<html> <head> <script> function ver() { var edad=parseInt(cedad.value);


if(edad<=18) alert(Abono Joven); else { if(edad>=65) alert(Abono 3 Edad); else alert(Abono normal); } } </script> <title>Pgina con ifs</title> </head> <body> Edad:
<input type="text" name="cedad" size="3" onBlur=ver();>

</body> </html>

Diplomado en Tecnologa JAVA

SWITCH:

Es una sentencia muy similar a if-else. Si los valores con los que se compara son nmeros se pone directamente el pero si es texto se debe encerrar entre comillas. La sintaxis de esta sentencia es:
SINTAXIS: switch (expresin){ case constante1: sentencia(s); break; case constante2:

sentencia(s);
break; case constante3: sentencia(s); break; case constanteN: sentencia(s); break; [default:] sentencia(s); Diplomado en Tecnologa JAVA }

El valor de la expresin se compara con cada una de las constantes de la sentencia case, si coincide alguno, se ejecuta el cdigo que le sigue, y cuando ejecuta break sale de este bloque hasta salir del switch. Si ninguno coincide se realiza el bloque default (opcinal), si no lo hay no se ejecuta nada. En el caso que varias sentencias case realicen la misma ejecucin se pueden agrupar, utilizando una sola sentencia break. Evitamos de este modo duplicar lneas de cdigo. La sintaxis es la siguiente: SINTAXIS: switch (expresin){ case constante1: case constante5: sentencia(s); break; case constante3: sentencia(s); break; [default:] sentencia(s); Diplomado en Tecnologa JAVA }

EJEMPLO: <html> <head> <script> function espe() { var tipo=cespe.value; switch(tipo) { case "humano": alert("Eres un Humano"); break; case "planta": alert("Eres un Vegetal"); break; case "animal": alert("Eres del reino Animal"); break; default: alert("Especie Desconocida"); break; } } </script> </head> <body> ESPECIE:
<input type="text" name="cespe" size="20" onBlur=espe();>

</body> </html>

Diplomado en Tecnologa JAVA

WHILE: Ejecuta repetidamente el mismo bloque de cdigo hasta que se cumpla una condicin de terminacin. Hay cuatro partes en todos los bucles. Inicializacin, cuerpo, iteracin y condicin. SINTAXIS: [inicializacin;] while(condicion[es]) { cuerpo; [iteracin;]

Diplomado en Tecnologa JAVA

DO..WHILE: Es lo mismo que en el caso anterior pero aqu como mnimo siempre se ejecutar el cuerpo del bucle una vez, en el tipo de bucle anterior es posible que no se ejecute ni una sola vez el contenido de este. SINTAXIS: [inicializacin;] do{ cuerpo; [iteracin;] }while(condicin);

Diplomado en Tecnologa JAVA

FOR: Realiza las mismas operaciones que en los casos anteriores pero la sintaxis es una forma compacta. Normalmente la condicin para terminar es de tipo numrico. La iteracin puede ser cualquier expresin matemtica valida. Si de los 3 trminos que necesita no se pone ninguno se convierte en un bucle infinito.

SINTAXIS: En caso de ser una sola sentencia por parte las llaves son opcionales. for (inicio;cond_fin;iteracin) { sentencia(S); }

Diplomado en Tecnologa JAVA

EJEMPLO: El tipo de bucle puede ser cualquiera de los 3 (for, while, do..while). <html> <head> <script> function opt() { while(valor<=10) { alert("Esto sale 10 veces:"+ valor); valor++; } } </script> </head> <body>
<a href= www.itdurango.edu.mx onMouseOver=opt();>ir a itdurango</a>

</body> </html>
Diplomado en Tecnologa JAVA

Dentro de las sentencias de control se pueden incluir las sentencias de ruptura ya que van muy ligadas a los bucles. Estas sentencias de ruptura son continue y break. A continuacin vamos a ver como acta cada una de ellas

La sentencia continue lo que hace es ignorar las sentencias que tiene el bucle y saltar directamente a la condicin para ver si sigue siendo verdadera, si es as, sigue dentro del bucle, en caso contrario, saldra directamente de el.
La sentencia break tiene una operatoria ms drstica que la sentencia continue, en vez de saltar a la lnea de la condicin para comprobar su estado, lo que hace es abandonar directamente el bucle dndolo por terminado.

Diplomado en Tecnologa JAVA

EJEMPLO 1: Comparamos la actuacin de continue y break.


CONTINUE El bucle terminara cuando muestre el 10 BREAK

El bucle terminara cuando muestre el 4

<html> <head> <script> function bucle() { var cont=1; while(cont<=10) { alert(cont); cont++; if(cont==5)

continue;
} } </script> </head> <body onLoad=bucle();></body> </html>

<html> <head> <script> function bucle() { var cont=1; while(cont<=10) { alert(cont); cont++; if(cont==5)

break;
} } </script> </head> <body onLoad=bucle();></body> </html>
Diplomado en Tecnologa JAVA

EJEMPLO 2:
CONTINUE CONTINUE

El bucle terminara cuando muestre el 10

El bucle terminara cuando muestre el 4

<html> <head> <script> function bucle() { var cont=1; while(cont<=10) { alert(cont); cont++; if(cont==5)

<html> <head> <script> function bucle() { var cont=1; while(cont<=10) { alert(cont); cont++; if(cont==5) {

cont=30;
continue; } } } </script> </head> <body onLoad=bucle();> </body> Diplomado en Tecnologa JAVA </html>

continue;
} } </script> </head> <body onLoad=bucle();> </body> </html>

Tambin podramos considerar como sentencia de ruptura (sin serlo), un tipo de ventana estndar llamada confirm. Este tipo de ventana nos permite elegir entre 2 opciones, cada una con un valor de retorno. Con lo que se puede llamar a las sentencias de ruptura (break, continue) segn la opcin que se elija.

Diplomado en Tecnologa JAVA

SINTAXIS:

var_boolean=confirm(texto de la ventana);

BOTON PULSADO

VALOR DE RETORNO

ACEPTAR

true

CANCELAR

false

Diplomado en Tecnologa JAVA

EJEMPLO 1: <html> <head> <script> function confirma() { var respuesta=confirm("Pulsa un botn"); if (respuesta==true) alert("Has pulsado ACEPTAR"); else alert("Has pulsado CANCELAR"); } </script> </head> <body onLoad=confirma();> </body> </html>
Diplomado en Tecnologa JAVA

EJEMPLO 2: <html> <head> <script> function salida() { var cont=1; var paso=1; var res; for(cont=1;cont<=100;cont++) { alert("Paso " +cont); if(paso==10) { paso=0; res=confirm("Desea Seguir?"); if (res==false) break; } paso++; }

} </script> </head>
<body onLoad=salida();> </body> </html> Diplomado en Tecnologa JAVA

PASO DE PARMETROS A FUNCIONES


Es el paso de informacin (parmetros) a una funcin. Cuando se realiza la llamada hay que indicar entre los parntesis los valores que se van a enviar. Estos valores son recogidos por variables locales que son declaradas dentro de los parntesis. El utilizar este mtodo de trabajo, evita duplicar lneas, agrupamos el cdigo y nos hace ms sencillo la modificacin y deteccin de errores en el cdigo. El modo de hacer esto es bsicamente igual que cuando trabajos con las funciones, lo nico que cambia son los valores. SINTAXIS DE LA LLAMADA: <elemento evento=nombre_funcion(valor1,valor2,valorN);> nombre_funcion(valor1,valor2,valorN);

SINTAXIS DEL DESARROLLO:

function nombre_funcion(var1,var2,varN) { sentencia(s); }

Diplomado en Tecnologa JAVA

Solo debemos tener en cuenta, que en la llamada y el desarrollo, el nmero de parmetros coincida en ambos casos. EJEMPLO 1: <html> <head> <script> function opt(valor) { if(valor==1) alert("Vas a ir a uno"); else alert("Vas a ir a dos"); } </script> <title>Autor:Curso Titulacin</title> </head>

<body> <a href="Uno.htm" onMouseOver=opt(1);>ir a uno</a> <a href="Dos.htm" onMouseOver=opt(2);>ir a dos</a> </body> </html>
Diplomado en Tecnologa JAVA

EJEMPLO 2: <html> <head> <script> function opt(valor) { var cadena; switch(valor){ case 1: cadena=uno; break; case 2: cadena=dos; break; case 3: cadena=tres; break; } alert(Vinculo +cadena); } </script> <title>Autor:Curso Titulacin</title> </head> <body> <a href="Uno.htm" onMouseOver=opt(1);>uno</a> <a href="Dos.htm" onMouseOver=opt(2);>dos</a> <a href="Tres.htm" onMouseOver=opt(3);>tres</a> </body> Diplomado en Tecnologa JAVA </html>

MATRICES (Arrays)
Una matriz es una coleccin de variables del mismo tipo que tiene un nombre comn. A un elemento especifico de un matriz se accede mediante su ndice. Todos los arrays tienen como primer ndice el valor 0. Hay que tener muy presente NO rebasar el valor del ltimo ndice.

SINTAXIS:

var nombre_array=new Array();


INICIALIZACIN DE UN ELEMENTO:

nombre_array[indice]=valor;

UTILIZACIN DE ELEMENTOS: Casi como si se tratase de una variable normal.

nombre_array[indice];
Diplomado en Tecnologa JAVA

EJEMPLO:

<html> <head> <script> function opt() { var tabla=new Array();


tabla[0]="hola"; tabla[1]="adios"; tabla[2]="tarde"; tabla[3]="noche"; tabla[4]=tabla[0]+tabla[1]; alert(tabla[0] +"\n" +tabla[1]); alert(tabla[4]); } </script> </head> <body> <input type="button" value="Ver" onClick=opt();> Diplomado en Tecnologa JAVA </body>
</html>

CONTROLES
Hasta el momento hemos visto nicamente botones, cajas de texto y enlaces como controles con los cuales el usuario puede interactuar. Con JavaScript podemos utilizar cualquier control de un formulario para que el usuario interacte con ellos igual que con los anteriormente vistos, ampliando la flexibilidad a la hora de realizar programas. Cuantos ms controles podamos utilizar mejor.

CONTROL

MODO DE EMPLEO

Radio Botones (Radio) Casillas de verificacin (checkBox) Cajas de Contrasea (passWord) Cajas de texto multilnea (area)

Igual que un botn de comando.

Igual que un botn de comando o un radio botn.

Igual que una caja de texto.

Igual que una caja de texto o caja de contrasea.

Listas y Listas desplegables (select)

Construir el elemento como siempre, aadiendo en la etiqueta <select> el evento change. Y en cada etiqueta <option> aadir el atributo value para poder identificar cual de los elementos ha sido elegido.

Diplomado en Tecnologa JAVA

EJEMPLO 1: Radio Botones (Radio). El ordenador generar un nmero aleatorio comprendido entre 1 y 3. Nosotros deberemos pulsar en
el radio botn que deseemos. Si acertamos ganamos 100pts, cada fallo perderemos 50pts. Si acertamos se generar automticamente otro nmero para seguir jugando.

<html><head> <script> var banco=100; var num_secreto=0; function genera() { num_secreto=Math.random()*3; num_secreto=Math.round(num_secreto); if(num_secreto==0) num_secreto=3; } function juego(valor) { if(num_secreto==valor) { alert("Enhorabuena"); banco+=100; genera(); } else { banco-=50; } caja.value=banco; } Diplomado en Tecnologa JAVA </script> </head>

<body onload=genera();> Apuesta: 1<input type="radio" name="R1" onClick=juego(1);> <br>

2<input type="radio" name="R1" onClick=juego(2);>


<br> 3<input type="radio" name="R1" onClick=juego(3);> <br> banco:

<input type="text" name="caja" size="20" value="100">


</body> </html>
Diplomado en Tecnologa JAVA

EJEMPLO 2: Caja de contrasea (passWord). Escribiremos una palabra en una caja de contrasea, y
por cada letra que pongamos, en una caja de texto normal, iremos viendo las letras puestas en la caja de contrasea.

<html><head> <script> function pasa() {


var temporal; temporal=secre.value; caja.value=temporal; }

</script> </head><body> CONTRASEA:


<input type="password" name="secre" size="5" onKeyUp=pasa();>

<br> NORMAL: <input type="text" name="caja" size="5"> </body></html>

Diplomado en Tecnologa JAVA

EJEMPLO 3: Lista o Lista desplegable (select). Mostramos una lista desplegable o lista (el modo de trabajo es el mismo). De la lista desplegable elegimos un destino que nos mostrar informacin del destino elegido. Ms adelante trabajaremos con enlaces. <html> <head> </script> </head> <script> function viaje() { var valor=destino.value; var cadena; switch(valor) { case "1": cadena="Quito. Precio: 27.900"; break; case "2": cadena="Moscu. Precio: 17.000"; break; case "3": cadena="Paris. Precio: 57.900"; break; case "4": cadena="Roma. Precio: 17.900"; break; } alert(cadena); } Diplomado en Tecnologa JAVA
(sigue)

<body> <select size="1" name="destino" onChange=viaje();> <option value="1">Quito</option> <option value="2">Moscu</option> <option value="3">Paris</option> <option value="4">Roma</option> </select> </body> </html>

Diplomado en Tecnologa JAVA

EJEMPLO 4: Mismo que el anterior pero ms reducido. <html> <head> <script> function viaje() { var valor=destino.value; alert(valor); } </script> </head> <body> <select size="1" name="destino" onChange=viaje();> <option value="Quito. Precio:17.900">Quito</option> <option value="Moscu. Precio:17.000">Moscu</option> <option value="Paris. Precio:57.900">Paris</option> <option value="Roma. Precio:27.900">Roma</option> </select> </body> </html>
Diplomado en Tecnologa JAVA

ANIMACIONES
La animacin en JavaScript puede ser de texto, imgenes o ambas cosas interactuando. En todos los casos para conseguirla se trabaja del mismo modo. Lo primero que tendremos que hacer es preparar las etiquetas del texto o de la imagen dandoles un nombre (con los mismos requisitos que las variables) por medio del atributo name en caso de las imgenes e id en caso de texto. De esta manera podremos hacer referencia al elemento deseado desde la funcin encargada de ejecutar la animacin. A continuacin, aadiremos el evento con la llamada a la funcin (si es necesario, en muchas ocasiones se llama a la funcin por medio del mtodo setTimeout que veremos en un momento).

Diplomado en Tecnologa JAVA

El ltimo cambio que afecta a las etiquetas del texto o de la imagen afecta a los estilos. Por tanto tendremos que aadir obligatoriamente el atributo style con todos aquellos estilos que intervengan en la animacin. De entre todos los estilos que existen, podemos destacar los que hay en la siguiente tabla.

ESTILOS

SINTAXIS
style=Position:absolute;top:pos; left:pos

DESCRIPCIN
Posibilita el cambio de posicin. Posibilita el cambio de color. Posibilita mostrar y ocultar.

style=color:nombre_color
style=visibility:hidden o visible

Recordar que si trabajamos con varios estilos todos se incluyen dentro de un atributo style.
Diplomado en Tecnologa JAVA

Una vez construida y modificada la o las etiquetas, las variaciones que sufran sus etilos o cualquier otro de sus atributos se realizarn en la funcin que tengamos preparada para ello. Para todos los cambios que realicemos la sintaxis a seguir es: SINTAXIS:

nombre_etiqueta.style.estilo=valor;
nombre_etiqueta.atributo=valor;

Diplomado en Tecnologa JAVA

Si nuestra animacin avanza segn un intervalo de tiempo, debemos utilizar el mtodo setTimeout() para establecer el intervalo de tiempo y la llamada a la funcin. Este mtodo se puede utilizar en cualquier parte del cdigo, pero normalmente se encuentra al principio del cdigo y dentro de la funcin donde se realiza cada uno de los pasos de nuestra animacin. La sintaxis del mtodo es (recordar respetar maysculas y minsculas):

SINTAXIS:

setTimeout(nombre_funcin(), intervalo milisegundos);


Diplomado en Tecnologa JAVA

EJEMPLO 1: Texto con movimiento en horizontal.

<html> <head> <script> var horizontal=12; setTimeout("mueve()",500); function mueve() { horizontal+=10; TEXTO1.style.left=horizontal; if(horizontal>=200) horizontal=12; setTimeout("mueve()",500); } </script> </head> <body>
<p id="TEXTO1" style="position:absolute; top:16; left:12">

TEXTO </p> </body> </html>


Diplomado en Tecnologa JAVA

EJEMPLO 2: Texto que aparece y desaparece.

<html> <head> <script> var estado=true; setTimeout("ver()",500); function ver() { estado=!estado;


if(estado==true) TEXTO1.style.visibility="visible"; else TEXTO1.style.visibility="hidden"; setTimeout("ver()",500); } </script> </head> <body> <p id="TEXTO1" style="visibility:visible">TEXTO</p> </body> </html> Diplomado en Tecnologa JAVA

EJEMPLO 3: Imagen que cambia cuando entra y sale el ratn.

<html> <head> <script> function pasa(valor) { if(valor==1) img.src="ten1.gif" else img.src="ten2.gif" } </script> </head>
<body> <img name="img" src="ten2.gif" onMouseOver=pasa(1);

onMouseOut=pasa(2);> </body> </html>

Diplomado en Tecnologa JAVA

EJEMPLO 4: Imgenes que van cambiando solas.

<html> <head> <script> var estado=true; setTimeout("cambio()",500); function cambio() { estado=!estado;


if(estado==true) img.src="tenista1.gif" else img.src="tenista2.gif" setTimeout("cambio()",500); } </script> </head> <body> <img name="img" src="tenista1.gif"> </body> </html>
Diplomado en Tecnologa JAVA

EJEMPLO 5: Cambiamos la imagen segn situemos el ratn en un texto o en otro. <html> <head> <script> function imag(valor) { if(valor==1) img.src="tenista1.gif" else img.src="tenista2.gif" } </script> </head> <body> <table border="1" width="15%"> <tr>
<td width="100%"><p onMouseOver=imag(1);>IMAGEN 1</td>

</tr> <tr>
<td width="100%"><p onMouseOver=imag(2);>IMAGEN 2</td>

</tr> </table> <br> <img name="img" src="tenista1.gif"> </body> Diplomado en Tecnologa JAVA </html>

EJEMPLO 6: Cambiar la imagen por medio de un control. En este caso una lista (select). Es igual que
en el caso anterior. Lo nico que cambia es el evento que gestiona la llamada a la funcin.

<html> <head> <script> function cambio(valor) { if(valor=="imagen1") img.src="tenista1.gif" else img.src="tenista2.gif" } </script> </head> <body> <select size="3" name="lista" onChange=cambio(value);> <option value="imagen1">Imagen 1</option> <option value="imagen2">Imagen 2</option> </select> <br> <img name="img" src="tenista1.gif"> </body> Diplomado en Tecnologa JAVA </html>

EJEMPLO 7: Una imagen movindose en vertical automticamente.

<html><head> <script> var vertical=35; var ida=true; setTimeout("mover()",200); function mover() { if(vertical<=200 && ida==true) vertical+=10; else { vertical-=10; ida=false; if(vertical<=35) ida=true; } img.style.top=vertical; setTimeout("mover()",200); } </script> </head> <body> <img name="img" src="pic.gif" style="position:absolute; left:12; top:35"> Diplomado en Tecnologa JAVA </body> </html>

EJEMPLO 8: Varias imgenes movindose en vertical automticamente. <html><head> <script> //para que cargue la imagen desde el principio var dibujo=new Image; dibujo.src=pic2.gif; var vertical=35; var ida=true; setTimeout("mover()",200); function mover() { estado=!estado; if(estado==true) img.src="tenista1.gif" else img.src="tenista2.gif" if(vertical<=200 && ida==true) vertical+=10; else { vertical-=10; ida=false; if(vertical<=35) ida=true; } img.style.top=vertical; setTimeout("mover()",200); } </script> </head> <body> <img name="img" src="pic1.gif" style="position:absolute; left:12; top:35"> </body> </html> Diplomado en Tecnologa JAVA var estado=true;

OBJETOS PREDEFINIDOS
Cuando se carga un documento en el navegador, se crean automticamente una coleccin de Objetos predefinidos, tiles para describir el documento sobre el que se trabaja, la ventana del navegador y todo tipo de elementos de las pginas web. Se agrupan en los objetos window, document, history, navigator y screen. Tambin hay toda una coleccin de objetos para utilidades varias.

WINDOW: Nos permite definir las caracterstica de la ventana del navegador o de las ventanas que construyamos nuevas. A continuacin tenemos los mtodos mediante los cuales podremos definir sus caractersticas.

Diplomado en Tecnologa JAVA

METODO

DESCRIPCIN

SINTAXIS

open

Abrir ventanas.

var=window.open(url,name,atrbs);

close

Cerrar ventanas.

var.close();

opener

Indica si se abrio.

var_boolean=var.opener

SI devuelve

true

closed

Indica si se cerr.

var_boolean=var.closed

SI devuelve

false

Location

Enlaza con una pgina.

var.Location=url;

print

Imprime el documento.

var.Print();

alert

Abre ventanas alert.

var.alert(datos);

confirm

Abre ventanas confirm.

var.confirm(datos);

prompt

Abre ventanas prompt.

var.prompt(datos,val inici);

Diplomado en Tecnologa JAVA


status Texto en barra estado. var.status=mensaje;

ATRIBUTOS DE SHOWMODALDIALOG (atrbs)

ATRIBUTO dialogWidth:valor

ELEMENTO

Define el ancho.

dialogHeight:valor

Define el alto.

dialogTop:valor

Define posicin superior

dialogLeft:valor

Define posicin inferior.

Todos los atributos que se pongan irn dentro de las comillas y separados por un espacio entre ellos. Todos ellos son opcionales.

Diplomado en Tecnologa JAVA

ATRIBUTOS DE OPEN (atrbs) ATRIBUTO toolbar=[yes|no] ELEMENTO Barra de herramientas.

location=[yes|no]

Barra de direcciones.

directories=[yes|no]

Histrico.

channelmode==[yes|no] menubar=[yes|no]

Barra de canales. Barra de mens.

status=[yes|no]
scrollbars=[yes|no]

Barra de estado.
Barras de Scroll.

resizable=[yes|no]

Dimensionable. Diplomado en Tecnologa JAVA

width=pixels height=pixels

Ancho de ventana.

Alto de ventana.

fullscreen=[yes|no]

Maximizada.

top=pixels left=pixels

Posicin superior.

Posicin izquierda

Todos los atributos que se pongan irn dentro de las comillas y separados por un espacio entre ellos. Todos ellos son opcionales.

Diplomado en Tecnologa JAVA

EJEMPLO 1:

<html> <head> <script> var v1; function abre() {


v1=window.open("ab.htm","v","status=yes resizable=yes);

v1.status="Ventana creada para publicidad"; status="Ventana Estandar del Navegador"; } function cierra() { v1.close(); } </script> </head> <body onload=abre();> <input type="button" value="Cerrar" onClick=cierra();> </body> Diplomado en Tecnologa JAVA </html>

EJEMPLO 2:

<html> <head> <script> var v1;


function abre() {
v1=window.open("ab.htm","v","status=yes resizable=yes);

} function opera(valor) { switch(valor) { case 1: cargapagina(); break; case 2: print(); break; case 3: var modal; modal=window.showModalDialog("ab2.htm"); break; Diplomado en Tecnologa JAVA } }

function cargapagina() { var cerrada=v1.closed; if(cerrada==false) v1.Location="ab2.htm"; else alert("Error.\nv1 debe estar abierta."); } </script> </head> <body onload=abre();> <input type="button" value="Cargar onClick=opera(1);> <br> <input type="button" value="Imprime" onClick=opera(2);> <br> <input type="button" value="Modal" onClick=opera(3);> </body> </html>

Diplomado en Tecnologa JAVA

METODO write

DESCRIPCION Escribe en el documento.

SINTAXIS document.write(dato);

writeln

Escribe y salta de lnea.

document.writeln(dato);

alinkColor

Color de enlace (sin usar).

document.alinkColor=color;

linkColor

Color de enlace (activo).

document.linkColor=color;

vlinkColor
bgColor fgColor referrer

Color de enlace (usado).


Color de fondo. Color del texto. Url del documento anterior.

document.vlinkColor=color;
document.bgColor=color; document.fgColor=color; var=document.referrer;

location

Url del documento actual.

var=document.location;

lastModified

Diplomado en Tecnologa JAVA var=document.lastModified; Fecha modificacin.

EJEMPLO 1:

<html> <head> <script> function fondo(colores){document.bgColor=colores;} function texto(colores){document.fgColor=colores;} </script> </head>


<body> COLOR DEL FONDO <br> BLANCO<input type="radio" name="F" onClick=fondo("white");>
<br>

ROJO<input type="radio" name="F" onClick=fondo("red");>


<br>

AZUL<input type="radio" name="F" onClick=fondo("blue");> <br> <br> COLOR DEL TEXTO NEGRO<input type="radio" name="T" onClick=texto("black");>
<br>

GRIS<input type="radio" name="T" onClick=texto("gray");>


<br>

VERDE<input type="radio" name="T" onClick=texto("green");> </body> Diplomado en Tecnologa JAVA </html>

EJEMPLO 2: <html> <head> <script> var v1; function ver() { var fecha; var urlantes; var urlactual; fecha=v1.document.lastModified; urlantes=v1.document.referrer; urlactual=v1.document.location; v1.document.writeln("Creada en " +fecha); v1.document.writeln("Direccin " +urlactual); v1.document.write("Url anterior " +urlantes); } function abre() {
v1=window.open("ab.htm","v","status=yes resizable=yes);

} </script> </head> <body onLoad=crea();> <input type="button" value="Info. Pag" onClick=ver();> Diplomado en Tecnologa JAVA </body> </html>

HISTORY:

Objeto derivado de window, contiene todas las direcciones que se han ido visitando durante la sesin actual. Al ser un objeto derivado de window, este tambin puede utilizar sus mtodos. Tiene 3 mtodos:

METODO

DESCRIPCIN

SINTAXIS

back()

Vuelve a la pgina anterior.

window.history.back();

forward ()

Nos lleva a la pgina siguiente.

window.history.forward();

-1 como back.

go (valor)

Van donde le indique nmero. Este puede ser:

el

num lleva a pag X

window.history.go(valor);

1 como forward Diplomado en Tecnologa JAVA

EJEMPLO:

<html> <head> <script> function pasa(valor) { window.history.go(valor); } </script> </head>


<body> <input type="button" value="Atrs" onClick=pasa(-1);> <br> <input type="button" value="Adelante" onClick=pasa(1);> <br> <a href="ab.htm">ir a la pagina AB</a> </body> </html> Diplomado en Tecnologa JAVA

NAVIGATOR:

Objeto que contiene la informacin del navegador que se est utilizando. Todos sus mtodos muestran informacin sin posibilidad de modificarla. Los mtodos ms comunes que se utilizan son:

MTODO

DESCRIPCION

SINTAXIS

appName

Devuelve el Nombre.

var=navigator.appName;

appVer

Devuelve la Versin.

var=navigator.appVer;

userLanguaje

Cdigo del Lenguaje.

var=navigator.userLanguage;

platform

Plataforma de trabajo.

var=navigator.platform;

cpuClass

Tipo de micro.

var=navigator.cpuClass;

connectionSpeed

var=navigator.connectionSpeed; Velocidad de conexn. Diplomado en Tecnologa JAVA

EJEMPLO:

<html> <head> <script> function informa() { var v1; var nombre; var cpu; var sistema;
v1=window.open("","v","width=300 height=150"); v1.document.bgColor="gray"; nombre=navigator.appName; cpu=navigator.cpuClass; sistema=navigator.platform; v1.document.writeln("Navegador: " +nombre); v1.document.writeln("Sistema: " +sistema); v1.document.write("Micro: " +cpu); } </script> </head> <body> <input type="button" value="Info." onClick=informa();> </body> Diplomado en Tecnologa JAVA </html>

SCREEN:

Objeto por el cual podemos conocer la configuracin y tipo de tarjeta grfica que tiene el usuario. Lo mismo que en el objeto anterior, no hay posibilidad de modificar la configuracin. Sus mtodos ms importantes son:

MTODO

DESCRIPCIN

SINTAXIS

height

Altura de la pantalla.

var=screen.height

width

Ancho de la pantalla.

var=screen.width

colorDepth

Bits por pixel, los colores en pantalla.

var=screen.colorDepth

Diplomado en Tecnologa JAVA

EJEMPLO:

<html> <head> <script> function resol() { var ancho=screen.width; var alto=screen.height;


if(ancho<1800 && alto<1600) { alert("Aumentar Resolucin a 1800x1600"); document.write("Aumente la Resolucin"); } } </script> </head> <body onLoad=resol();> </body> </html>
Diplomado en Tecnologa JAVA

MTODOS PARA FECHA Y HORA


Mtodos que nos van a permitir realizar una serie de operaciones o procedimientos utilizando fechas y horas. Lo primero que tendremos que hacer, construir un objeto Date, para que posteriormente podamos utilizar los mtodos de fecha y hora. SINTAXIS DEL OBJETO: var nombre_objeto=new Date();
Diplomado en Tecnologa JAVA

MTODOS DE FECHA Y HORA MTODO objeto.toGMTString() ; objeto.getDate(); objeto.getMonth()+1; objeto.getYear(); objeto.getHours(); objeto.getMinutes(); objeto.getSeconds(); Todas estas funciones tienen su pareja que nos permite modificar sus valores. Su Diplomado en Tecnologa sintaxis es la misma, solo que ahora comienzan porJAVA Por ejemplo set. setMinutes(minutos) cambiar los minutos de la hora del sistema. DESCRIPCIN

EJEMPLO 1: <html><head> <script> function fecha(){

var obj_fecha=new Date(); var completo=obj_fecha.toGMTString(); var hora=obj_fecha.getHours(); var minuto=obj_fecha.getMinutes(); var segundo=obj_fecha.getSeconds(); var dia=obj_fecha.getDate(); var mes=obj_fecha.getMonth()+1; var anis=obj_fecha.getYear(); alert(hora +":" +minuto +":" +segundo); alert(dia +"/" +mes +"/" +anis); alert(completo);

} </script></head> <body onLoad=fecha();></body> </html>

Diplomado en Tecnologa JAVA

EJEMPLO 2: Creacin de un reloj digital. <html>

<head>
<script> setTimeout("reloj()",100); function reloj() { var tiempo=new Date(); var hora=tiempo.getHours(); var minuto=tiempo.getMinutes(); var segundo=tiempo.getSeconds(); var textohora=hora+":"+minuto+":"+segundo; caja.value=textohora; setTimeout("reloj()",500); } </script> </head> <body> <input type="text" name="caja" size="10"> </body>

<html>

Diplomado en Tecnologa JAVA

MTODOS MATEMTICAS
Contiene los mtodos para realizar cualquier tipo de operacin matemtica compleja. Solo necesitamos llamar al mtodo deseado utilizando el objeto Math (ya esta creado). Los mtodos mas tiles son:

MTODOS MATEMTICOS MTODO var=Math.sin(valor); var=Math.cos(valor); var=Math.tan(valor); DESCRIPCIN Seno de un ngulo. Expresado en radianes. Coseno de un ngulo. Expresado en radianes. Tangente de un ngulo. Expresado en radianes.

Diplomado en Tecnologa JAVA

MTODOS MATEMTICOS MTODO DESCRIPCIN

asin(),acos(),atan());

Iguales a las anteriores pero devuelve arcos. Valor absoluto (su positivo). Logaritmo decimal de valor. Devuelve el mayor de los dos. Devuelve el menor de los dos

var=Math.abs(valor)

var=Math.log(valor);

var=Math.max(val1,val2); var=Math.min(val1,val2);

var=Math.pow(base,expon); Potencia de base Diplomado en Tecnologa JAVA

MTODO

DESCRIPCIN

var=Math.sqrt(valor); var=Math.round(valor);

Raz cuadrada del valor. Redondea un valor con decimales. Nmero aleatorio entre 0 y el intervalo.

var=Math.random()*interv;

Diplomado en Tecnologa JAVA

EJEMPLO 1: <html><head><script> function opera(valor){ var resultado; var num1=parseInt(cnum1.value); var num2=parseInt(cnum2.value); switch(valor){ case 1: resultado=Math.sqrt(Math.abs(num1)); break; case 2: resultado=Math.pow(num1,num2); break; case 3: resultado=Math.max(num1,num2); break; } resul.value=resultado; } </script> </head> <body> NUM1: <input type="text" name="cnum1" size="5" value="0"> <br> NUM2: <input type="text" name="cnum2" size="5" value="0"> <br> <br> <input type="button" value="Raiz" onClick=opera(1);> <input type="button" value="Potencia" onClick=opera(2);> <input type="button" value="Mximo" onClick=opera(3);> <br> Diplomado en Tecnologa JAVA <br> Resultado:<input type="text" name="resul" size="17">

EJEMPLO 2: Creamos nmeros aleatorios entre 1 y 10 para luego intentar acertarlo. <html> <head> <script> var secreto; function genera() { secreto=Math.random()*10; secreto=Math.round(secreto); if(secreto==0) secreto=10; } function juego() { var numero=parseInt(caja.value); if(numero==secreto) { alert("Muy bien.\n A por otro"); genera(); } else { if(numero<secreto) alert("Es mayor"); else alert("es menor"); } caja.focus(); caja.value=""; } </script> </head> <body onLoad=genera();> NUMERO:<input type="text" name="caja" size="3"> <input type="button" value="Compara" onClick=juego();> </body> </html> Diplomado en Tecnologa

JAVA

MTODOS PARA CADENAS Mtodos destinados a realizar operaciones con cadenas de texto. Al igual que las funciones matemticas vamos a necesitar un objeto. En este caso el objeto puede ser una variable normal y corriente que va a contener texto o tambin podramos construir un objeto String. En ambos casos se trabajar del mismo modo. SINTAXIS DEL OBJETO String: var nombre_objeto=new String();

Diplomado en Tecnologa JAVA

MTODO objeto/var.length; objeto/var.charAt(indice);

DESCRIPCIN Devuelve la longitud de la cadena. Devuelve la letra que este en la posicin del ndice. Devuelve el texto comprendido entre los ndices. Devuelve el ndice de la letra buscada. Reemplaza letr1 por letr2. Transforma en minsculas el texto del objeto.

objeto/var.subString(ind1,ind2);

objeto/var.indexof(letra);

objeto/var.replace(letr1,letr2);

objeto/var.toLowerCase();

Transforma en objeto/var.toUpperCase(); maysculas Diplomado en Tecnologa JAVA el texto del objeto.

EJEMPLO: Pedimos una contrasea de mnimo 4 letras, la pasamos a maysculas y mostramos la primera letra. Si la contrasea no llega a 4 letras le avisamos del mnimo de letras y volvemos a pedir. <html><head> <script> function pasa(){ var contra=T.value; var nletras=contra.length; if(nletras<4) { alert("Mnimo 4 letras"); T.value=""; nletras=0; } if(nletras!=0){ contra=contra.toUpperCase(); alert("La primera es: "+contra.charAt(0)); } } </script> </head> <body> <input type="password" name="T" size="9" onBlur=pasa();> </body> </html>
Diplomado en Tecnologa JAVA

También podría gustarte