M

Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt

M
Ma
an
nu
ua
all p
pr
r
c
cttiic
co
od
de
eJ
Ja
av
va
aS
Sc
cr
riip
ptt
1.- Introduccin
1.1.- Resea histrica
Originalmente denominado LiveScript, fue desarrollado por Netscape Communications para crear
aplicaciones de Internet en el cliente.
Mas o menos en la misma poca, Sun Microsystems lanz el lenguaje de programacin JAVA (que
originalmente fue llamado Oak), el que adquiri rpidamente popularidad as que por razones netamente
comerciales se le cambia el nombre a JavaScript.
La versin 1.0 apareci con la version 2.0 del navegador de la misma empresa y mas tarde es
incorporado en el iExplorer 3.0 de MicroSoft. Poco tiempo despus aparece tambin el VBScript (Visual Basic
Script) de Microsoft, un muy buen competidor.

1.2.- Que es un script ?

Un script es una secuencia de ordenes, en un determinado lenguaje, que puede ser ejecutado por un
cliente Web desde su navegador y visualizar el documento en que est contenido.
Actuamente los dos lenguajes de script mas usados en paginas Web son JavaScript y VBScript. La
inclusion de scripts en los documentos HTML hace que stos sean ms inteligentes. El contenido se genera en
forma dinamica, mientras que los valores introducidos en los formularios pueden comprobar localmente, sin
necesidad de contar con un servidor y emplear un cierto tiempo en ello. A pesar del nombre, JavaScript, este
lenguaje tiene poco que ver con JAVA.

1.3.- Por qu JavaScript ?

Actualmente los navegadores Web mas usados son Netscape Navigator e Internet Explorer, ambos
soportan JavaScript, pero solo el Intenet Explorer soporta VBScript.

2.- Conceptos bsicos

JavaScript es un lenguaje interpretado en el cliente por el navegador al momento de cargarse la pagina,
es multiplataforma, orientado a eventos con manejo de objetos, cuyo cdigo se incluye directamente en el mismo
documento HTML.
Hasta entonces ya se usaba HTML y JAVA, pero la aparicin del JavaScript produjo una importante
revolucin, ya que dio al usuario la posibilidad de crear aplicaciones "on-line", es decir modificar pginas web en
tiempo real.

Pgina: 1

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt

2.1.- Caracteristicas
Es simple, no hace falta tener conocimientos de programacin para poder hacer un programa en
JavaScript.
Maneja objetos dentro de nuestra pgina Web y sobre ese objeto podemos definir diferentes eventos.
Dichos objetos facilitan la programacin de pginas interactivas, a la vez que se evita la posibilidad de ejecutar
comandos que puedan ser peligrosos para la maquina del usuario, tales como formateo de unidades, modificar
archivos etc.
Es dinmico, responde a eventos en tiempo real. Eventos como presionar un botn, pasar el puntero del
ratn sobre un determinado texto o el simple hecho de cargar la pgina o caducar un tiempo. Con esto podemos
cambiar totalmente el aspecto de nuestra pgina al gusto del usuario, evitndonos tener en el servidor un pgina
para cada gusto, hacer clculos en base a variables cuyo valor es determinado por el usuario, etc.

2.2.- Diferencia con JAVA

La principal diferencia es que JAVA es un lenguaje compilado, mientras que JavaScript es interpretado.
JAVA al compilar crea programas independientes, llamados APPLETS que se invocan desde una pagina Web,
mientras que el cdigo de JavaScript va incluido en la pagina.
Esta orientado a objetos de forma limitada ya que no maneja los conceptos de clase ni herencia.
En JavaScript no es necesario declarar el tipo de variable, ni debe existir las referencias al objeto antes
de ejecutarlo, por lo que se habla de una ligazn dinmica a diferencia de la ligazn esttica del JAVA.

2.3.- Principales aplicaciones

Si bien hoy en da, JavaScript, es un lenguaje muy usado, sus principales aplicaciones son:

Responder a eventos locales dentro de la pgina, como apretar un botn.

La realizacin de clculos en tiempo real.

La validacin de formularios dentro de una pgina.

La personalizacin de la pgina por el usuario, que le permitir tener una pgina web a su medida.

La inclusin de datos del propio sistema, como son la hora y la fecha.

Aunque segn pasa el tiempo sus aplicaciones se van incrementando.

2.4.- Dnde incluirlo

Antes siquiera de que conozcamos la sintaxis o una primera orden de JavaScript, debemos saber
primero cmo se incluye un script dentro de un documento HTML.

Pgina: 2

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt

hacerlo:

El cdigo JavaScript se inserta directamente en nuestra pagina HTML. Hay cuatro (4) maneras de

2.4.1..- En el cuerpo del documento

Es decir entre las etiquetas <BODY> y </BODY> usando el comando <SCRIPT>
<HTML>
<HEAD><TITLE>Titulo</TITLE></HEAD>
<BODY>
<SCRIPT LANGUAGE=JavaScript>
<!-- escondemos el cdigo>
document.write("Hola que tal");
// fin de esconder -->
</SCRIPT>
</BODY>
</HTML>

Este cdigo se ejecuta inmediatamente al cargar la pagina y lo que produce es un texto sobre la pagina,
para ello use el mtodo write del objeto document, que representa al documento actual1.
Observa que se emplea un comentario <!-- --> para ocultar el cdigo a los navegadores que no soportan
JavaScript.

2.4.2.- En archivo aparte

En este caso todo el cdigo del script esta situado en otro archivo y se hace una llamada.
<HTML>
<HEAD><TITLE>Titulo</TITLE></HEAD>
<BODY>
<SCRIPT SRC=codigo.js>
</SCRIPT>
</BODY>
</HTML>

Observa que aqu no fue necesario esconder ningn cdigo ya que los navegadores que no soporte el
comando SCRIPT simplemente lo ignorarn.

2.4.3.- Usando manejadores de evento

1

NOTA: Excepto en texto encomillado, JavaScript es sensible a maysculas y minsculas, por

lo que tendrs que tener el cuidado al usar por ejemplo document.write de escribirlo as, en
minsculas o no se interpretara. Cualquier error simplemente es ignorado. Se puede usar la
comilla simple para los valores de atributos.

Pgina: 3

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt
Los comandos de JavaScript son evaluados inmediatamente al cargarse la pagina. Las funciones son
almacenadas, pero no ejecutadas, hasta cierto evento.
<HTML>
<HEAD><TITLE>Titulo</TITLE></HEAD>
<BODY>
<A HREF="" evento=mtodo o llamada a funcin interna>algo</A>
</BODY>
</HTML>

Observa que ahora es un evento el que dispara.

2.4.4.- Haciendo una llamada a funcin

Dentro de la cabecera, despus del titulo. Es decir, entre los comandos </TITLE> y </HEAD> y luego la
llamada a la funcin en el cuerpo.
<HTML>
<HEAD>
<TITLE>Titulo</TITLE>
<SCRIPT LANGUAGE=JavaScript>
<!-- escondemos el codigo>
function Ver() {
alert("Le dije que NO !");
}
// fin de esconder -->
</SCRIPT>
</HEAD>
<BODY>
No haga Clic <A HREF="Ver()">AQUI</A>
</BODY>
</HTML>

Observa que aqu se defini la funcin en la cabecera, pero recin se ejecuta al hacer clic en el enlace,
que es el evento que llama a la funcin a la cual se le para un parmetro.

3.- VALORES, CONSTANTES Y EXPRESIONES

Pgina: 4

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt

3.1.- Tipos de datos

JavaScript acepta diferentes tipos de datos:
Tipo

Descripcin

Nmeros Pueden ser nmeros enteros o reales

Ejemplo
473.1416

Cadenas

Cualquier texto que este encerrado entre comillas. Pueden ser

"Hola que tal..."
simples o dobles

Lgicas

Tambin llamados Booleanos, son las que toman uno de dos valores de
true o false
verdadero o falso

Nulas

Es cuando la variable no toma ningn valor

null

3.2.- Valores y constantes

Tipo

Descripcin

Ejemplo

Nmeros
Enteros Decimales
Es una secuencia de dgitos (0-9) que no comiencen con 0
(base 10)

1999

Enteros
Hexadecimales
(base 16)

Una secuencia de dgitos (0-9) y letras (A-F) que comienza

0xE477
con 0x

Enteros
(base 8)

Secuencia de dgitos (0-7) que comiencen con 0

Octales

Punto flotante

0777

Puede tener un entero decimal, un punto, una fraccin

(otro numero decimal), un exponente que consiste en la 3.14159, -2e4, 5eletra e seguida de un entero, el cual puede llevar un signo 12
(+ o -).
Cadenas

Cadenas
caracteres

de Consta de uno o mas caracteres encerrados entre comillas

"Hola", '1999'
simples o dobles
\f indica un avance de pagina (Form feed)

Tambin
pueden \n Indica nueva lnea (New Line)
usar los siguientes \r Indica un retorno de carro (Carruage return)
caracteres
\t Indica un tabulador (Tab)
\" se puede incluir comillas. Ej: "Jos \"Chemo\" del Solar"
Logicas
Logicas

Verdadero o falso

true o false
Nulas

Nulas

Es cuando la variable no toma ningn valor

null

Pgina: 5

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt

3.3.- Expresiones
Es cualquier conjunto valido de constantes, variables y operadores que al evaluarse dan un nico valor
del tipo numrico, cadena o lgico.

3.4.- Variables
Las variables son elementos a los cuales les daremos un valor esttico, o un valor totalmente dinmico.
Para definir una variable lo podemos hacer de varias formas.

La primera, es la siguiente: var mivariable; en la cual la sentencia var hace que JavaScript, cree
una variable.
Pero tambin podemos definir la variable justo antes de usarla:
...aqu sentencias JavaScript
var mensaje = "HOLA";
...aqu ms sentencias

Probemos cmo se les pueden dar valores a las variables; podemos hacer que aparezca un cuadro en el
cual podamos insertar un texto, la siguiente fuente es la usada para hacer el siguiente ejemplo:
<html>
<head>
<title>Probemos la funcin creada</title>
<script language="JavaScript">
<!-function pregunta()
{
var nombre;
nombre = window.prompt("Escribe tu nombre:","");
window.alert("Hola "+nombre);
} //-->
</script>
</head>
<body>
<form>
<input type=button value=")-=PLSAME=-(" onclick="pregunta()">
</form>
</body>
</html>

3.5.- Variables tipo matriz

La sintaxis para crear la matriz es la siguiente: nombre=new Array(elementos), posteriormente para
usarla se usa nombre[# de elemento].

Pgina: 6

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt

3.6.-Operadores
Aritmeticos
+

Adicin

Sustraccin

Multiplicacin

Divisin

Modulo

++

Incremento

--

Decremento

Negacin
Cadena

Concatenacin.

Nota: Cuando se opera un valor de cadena con un numerico, el resultado es una

cadena.
Sobre BITs
AND o &

Devuelve un 1 en cada bit para el cual ambos operandos sean 1 y 0

en el resto.

OR o |

Devuelve un 0 en cada bit para el cual ambos operandos sean 0 y 1

en el resto.

O-EX o ^

Devuelve un 1 en cada bit para el cual uno de los operandos sea 1 y

el otro 0 y 0 en el resto.

NOT o ~

Devuelve un 1 en cada bit para el cual el operandos sean 0 y

viceversa.
Lgicos

&&

Devuelve verdadero si ambos operandos son verdaderos y falso en

el resto.

||

Devuelve falso si ambos operandos son falsos y verdadero en el

resto.

Devuelve falso si operando es verdadero y viceversa.

Comparacin

==

Devuelve verdadero si ambos operador son iguales.

!=

Devuelve verdadero si ambos operador son diferentes.

>

Devuelve verdadero si operador izquierdo es mayor al derecho.

>=

Devuelve verdadero si operador izquierdo es mayor o igual al

derecho.

<:

Devuelve verdadero si operador izquierdo es menor al derecho.

<=

Devuelve verdadero si operador izquierdo es menor o igual al

derecho.
Asignacin:

X=y

Asigna a x el valor de y

X+=y

Asigna a x el valor de x+y

Pgina: 7

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt
x-=y

Asigna a x el valor de x-y

X*=y

Asigna a x el valor de x*y

x/=y

Asigna a x el valor de x/y

x%=y

Asigna a x el valor de x%y

x<<=y

Asigna a x el valor de x=x<x<y

x>>y

Asigna a x el valor de x=x>x>y

x>>>=y

Asigna a x el valor de x=x>x>x>y

x&=y

Asigna a x el valor de x=x&y

x^=y

Asigna a x el valor de x=x^y

X|=y

Asigna a x el valor de x=x|y

4.- Inicio al control del flujo del prgrama.

Existen dos grandes tipos de sentencias de control, las sentencias estticas, y las dinmcas o blucles.
Entre las estticas, encontramos la sentencia if la cual se utiliza de la siguiente forma:
if ( sentencia de condicin )
{
grupo de sentencias JavaScript que se ejecutarn
en caso de que la sentencia de condicin sea "verdadera"
}

Un ejemplo claro de uso de la sentencia if sera este:

var esto = '25';
if ( esto < 100 )
{
window.alert('La variable esto es menor que 100');
}
else
{
window.alert('La variable no es menor que 100');
}

Por supuesto el ejemplo anterior, no tiene ningn sentido, pues la variable siempre ser menor que cien;
si piensan, esto nos puede ser de ayuda, quiero decir, si en lugar de usarse la variable esto de una forma
esttica, sino que su valor variase a travs de usar un window.prompt o una entrada de formulario o de cualquier
otra forma, si tendra alguna utilidad: veamos un ejemplo de utilizacin de las sentencias if y else, esta ltima
abarca todas las sentencias que no abarquen los "if" que estn por encima del mismo, en el ejemplo anterior
seran todos los nmeros mayores que 100 y el propio 100.
En este ejemplo demostraremos que si a una variable le damos el valor window.confirm este nos
devolver dos valores: 1 si el usuario pulsara el botn de Aceptar, y 2 si pulsase el de Cancelar:
var aquello = window.confirm("Cree Ud. que funcionar?");
if ( aquello )
{
window.alert("Botn Aceptar pulsado.");
}
else
{

Pgina: 8

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt
window.alert("Botn Cancelar pulsado.");
}

Espero que se haya entendido el ejemplo anterior y las sentencias if y else pues la siguiente sentencia
funciona de la misma manera, pero es un poco ms ordenada y a su vez restringida; no permite hacer
comparaciones mltiples; veamos pues la sentencia switch. Esta sentencia se usa de la siguiente forma:
switch ( variable )
{
case 1: sentencias break;
case 2: sentencias break;
case 3: sentencias break;
case 4: sentencias break;
case 5: sentencias break;
default: sentencias break;
}

La sentencia switch es muy sencilla de usar, despus del case se escribe el valor numrico que debe
cumplirse para que se ejecuten las sentencias, y despus de estas, un break; que le dir al intrprete de
comandos que las sentencias han acabado; y por ltimo la sentencia default: la cual hace la funcin del else, es
decir, toma los valores no recogidos en el resto de sentencias del bloque.

5.-Control del flujo del programa (bucles)

Existen dos tipos: los bucles normales, y los bucles de retardo de tiempo; estos ltimos los usaremos
para interactuar con los elementos del reloj. El ejemplo siguiente, muestra cmo una variable es modificada y
presentada a travs del bucle for. El ejemplo sera el siguiente:
function Bucle()
{
var estoesinteresante = "";
for (var i = 0; i<=10; i++ )
{
estoesinteresante += i+".\n";
}
window.alert(estoesinteresante);
}

Expliquemos el ejemplo anterior: 1 declaramos la funcin y la variable y le damos valor en blanco; 2

declaramos el bucle, en el cual la primera zona declara e inicializa la variable, la segunda pone la condicin a
cumplirse para que se ejecute el bucle, y la tercera indica el cambio que se le hace a la variable; en este caso se
llama incremento de i; 3 se invoca el objeto window.alert para que muestre el contenido de la variable.
Ahora veremos otro bucle: el while. Este bucle es mucho ms sencillo que el bucle for, pues simplemente
ejecuta algunas sentencias mientras la sentencia sea verdadera, por ejemplo:

Pgina: 9

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt
function Bucle_While()
{
var variable;
variable = 1;
while ( variable < 3 )
{
variable++;
window.alert(variable);
}
}

Esta funcin ejecuta la sentencia incremento de variable y muestra un cuadro de dilogo, mientras

variable sea menor que 3.

Llegamos al final de las sentencias de control del programa; ya slo nos quedan los tipos de bucle
llamados de retardo, estos se usan con la sentencia setTimeout(a,b) (recordar que JavaScript entiende
maysculas y minsculas ). Esta sentencia recibe dos valores, "a", que es la funcin a la cual queremos llamar, y
"b", que es el tiempo en milisegundos que JavaScript esperar antes de llamar a la funcin "a". Ejemplo:
setTimeout("MiFuncion()",5000);

6.- Inicio a formularios

Una de las cualidades de JavaScript, es la interaccin con los elementos de un formulario HTML, es
decir, que podemos comprobar si las entradas de un formulario son como deberan de ser, y que no estn en
blanco. Para ello, tendremos que darle un nombre al formulario, y un nombre a cada elemento al que queramos
acceder. Despus, simplemente, modificar a muestro antojo las propiedades del elemento del formulario, pero
con JavaScript. Un ejemplo claro sera el siguiente:
<html><head><title>P&aacute;gina de prueba</title>
<script language="JavaScript" type="text/javascript">
<!-function comprobar()
{
if ( document.formu.texto.value == "" )
{
window.alert('Por favor, rellene todos los campos.');
}
else
{
window.alert('Formulario completamente relleno.');
}
}
//-->
</script>
</head>
<body>
<form name=formu>
<input type=text name=texto>
<input type=button value="%$% ESTOY AQU %$%" onclick="comprobar()">
</form>
</body>
</html>

Pgina1
: 0

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt

7.- Formularios, barra de estado y apertura de nuevas

ventanas
En el captulo anterior aprendimos a validar entradas de formulario, por tanto en este captulo
ensearemos cmo validar un campo de e-mail; aunque lo valide de una forma bastante arcaica es vlida para lo
que queremos aprender:
E-Mail:
El cdigo sera el siguiente:
<html><head>
<script language="JavaScript" type="text/javascript">
<!-function Comprueba()
{
if (document.formu.email.value.indexOf('@') != -1)
{
window.alert('El campo tiene al menos 1 @, y parece ser correcto.');
}
else
{
window.alert('Introduzca bien el E-Mail porfavor.');
}
}
//-->
</script>
</head><body>
<form name=formu>
E-Mail: <input type=text name=email><br>
<input type=button value="--<-<@ PULSA @>->--" onClick="Comprueba()">
</form>
</body><html>

Este cdigo no debera tener mayor dificultad para ser entendido, pero si se fijan he incluido una
nueva funcin que a partir de ahora empezaremos a usar cuando validemos entradas de formulario,
esta es a.indexOf(b,c) donde a equivale a la variable de cadena de caractres en la cual se buscar la
subcadena b, empezando por un nmero determinado en c, esta funcin devualve el punto en el cual se
encuentra la subcadena b, y devuelve -1 si no se encuentra la subcadena; de todas formas contino con
la tradicin y les pido me escriban un e-mail en caso de que no lo entiendan.
Me falta por decir que cualquier atributo es modificable con JavaScript de forma dinmica, as que
investiguen y si tienen dudas mndenma un e-mail.
La barra de estado est situada normalmente en la esquina izquierda del navegador, pero esto es
variable, as que bsquenla en su explorador, y empecemos a trabajar con ella. Para ver un ejemplo de
barra de estado pulse el botn, el cdigo de la pgina abierta est debajo:
<html>
<head>

Pgina1
: 1

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt
<title>Tutorial JavaScript -> BARRA DE ESTADO</title>
</head>
<body onLoad="window.defaultStatus='Hola, yo soy la barra de estado.';">
<center>
<h2>Mire en la barra de estado</h2>
<form>
<input type=button value=Cerrar onClick="window.close(self)">
</center>
</form>
</body>
</html>

Por supuesto podemos hacer scripts que al pulsar un botn se escriba algo en la barra de estado, o
que se borre, o que al pasar el mouse se cambie... pero esto ya lo iremos viendo ms adelante. Ahora
explicar los eventos ms comunes que usar un programador JavaScript como Ud.:
Estos eventos se activarn cuando...
onMouseOver
...el mouse est encima
onUnLoad
...se cierre la ventana
onMouseOut
...el mouse no est encima
onAbort
...se pare la carga de una imgen
onClick
...se clickcee encima
onSelect
...se seleccione algo
onLoad
...se cargue la pgina
onCopy
...se copie algo
En este captulo vamos a proponer unos ejercicios los cuales les recomiendo hagan, pues as
practican y aprenden a descubrir tcnicas y tcticas como programadores que son, as que valor y al
toro: ( en el siguiente captulo pondr las soluciones )
1. Script que al pasar el mouse por encima de un vnculo se escriba en la bara de estado una explicacin
del vnculo.
2. Pgina con script que valide un formulario con campo de e-mail, nombre y apellidos. ( de la forma
explicada )
3. Pgina que pregunte por medio de un window.prompt el nombre, y que escriba en la barra de estado
Hola nombre que pase un buen rato.
Ir a la pgina de soluciones.
Para abrir ventanas nuevas, para desplegar banner publicitarios, o algn anuncio importante, o como
por ejemplo lo que hice para ensearle la barra de estado, se usa el window.open(a,b,c), la cual recibe tres
valores, a que es la URL de la pgina, ( si no se pone nada, se crea una ventana en blanco), b, tipo de
ventana, usaremos MsgWindow, y c, que son las propiedades de la ventana descritas a continuacin,
estas propiedades se ponen separadas por "," y despus de la "," no hay que poner espacio. Las
propidades son las siguientes:
status
yes o no
menubar
yes o no
width y height
valor
directories
yes o no
...
...
resizable
yes o no
De todas formas investiguen porque existen muchas ms propiedades de las ventanas que no
considero muy importantes.
Veamos un ejemplo de abrir ventanas mediante un botn con JavaScript:
El cdigo sera el siguiente:
function Abrir_Ventana()
{

Pgina1
: 2

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt
var propiedades = 'menubar=no,width=300,height=300,status=yes,resizable=no';
var ventana = window.open("","MsgWindow",propiedades);
var codigo = '<HTML><HEAD><TITLE>Pgina de prueba</TITLE></HEAD><BODY>';
codigo += '<H3>Esto es muy til para desplegar publicidad</H3><br>';
codigo += '<H3>O para desplegar algn cartel de aviso</H3><br>';
codigo += '<H3>O para lo que se te ocurra</H3><br>';
codigo += '<form><center>';
codigo += '<input type=button value=Cerrar onClick="window.close(self)">';
codgio += '</center></form></BODY></HTML>';
ventana.document.write(codigo);
}

Note que lo nico que hacemos es escribir el cdigo de una pgina web, en una ventana que hemos
abierto con JavaScript; esto es muy til, pero mucho ms til, es controlar la ventana que hemos
abierto mediante funciones JavaScript, como por ejemplo escribir algo en la barra de estado, cerrarla,
mandarla a una URL mediante la sentencia a.window.location=b; donde b es la URL a la cual queremos
mandar la ventana a, si a a no le damos valor tomar el de self, que se refiere a la ventana en la cual se
ejecuta la funcin, es decir la que ests viendo. Esto quiz te parezca un poco raro, as que por favor si
no entiendes algo mndame un e-mail. ( No me gusta romper la tradicin de pedirte un e-mail :-P )
captulo vamos a profundizar un poco en los eventos posibles en JavaScript, lo primero que debemos
saber, es que para los navegadores de Netscape 4.7 y anteriores, no todos los eventos son aplicables a
todos los elementos, esto quiere decir, que el elemento <IMG>, por ejemplo, no admite los eventos
onMouseOver ni onMouseOut, pero si onClick, y as pasar con muchos elementos, pero al contrario,
los navegadores Netscape 6.0, Internet Explorer 4.0 y posteriores, y Opera 5.0 si lo entienden, por lo
general con Internet Exploer, todos los elementos soportan todos los eventos, pero sin embargo el resto
de los navegadores, no todos los elementos permiten todos los eventos. Sabiendo esto, podemos hacer
dos cosas, programar por lo bajo o por lo alto, esto es, podemos pensar que que todos los usuarios
tienen el N 3.0 Gold, o IE 2.0, con lo cual nuestros scripts sern un poco arcaicos y algunas veces con
poca funcionalidad, o podemos pensar que el que no tenga N 6.0, Opera 5.0 o IE 5.5 como mnimo no
sabe lo suficiente como para usar nuestros scripts, por supuesto estos dos tipos de pensamiento son
completamente errneos, siempre hay que intentar programar por lo bajo, pero sin pasarnos, pues no
tiene sentido que podamos hacer muchas cosas, pero no las hagamos por si los visitantes no estn lo
suficientemente actualizados como para usarlos al 100%. En conclusin, debemos pensar que el
estndar est en N 4.5+ o IE 4.0+, pero siempre encontrars a alguien que tengan navegadores ms
antiguos, por tanto, JavaScript nos permite averiguar la versin y el navegador que el usuario est
usando en el momento de visualizar la pgina, esto se hace con las siguientes funciones:
navigator.appName
navigator.appVersion
navigator.appVersion.charAt(0)

...este devuelve el nombre del navegador

... y este la versin, pero ser ms eficiente usar la de abajo...
...devuelve el primer caracter de la versin del navegador.

En la tima sentencia, aparece una funcin que an no haba explicado a.charAt(b), la cual devuelve
el caracter de la cadena a, situado en la posicin b, ( cabe destacar que las cadenas empiezan en el
caracter 0 ). Si no algo no ha quedado claro, ya sea tanto de la teora de los eventos y los navegadores,
como de la funcin charAt, esribidme un e-mail. ( Me gusta seguir la costumbre del e-mail ).

Vamos a profundizar un poco ms con esto de los eventos, vamos a ver un ejemplo de una imgen
que cambia al pasar el mouse por encima, esto es muy sencillo, pero si no se tiene el cuidado

Pgina1
: 3

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt
suficiente, puede quedar un script bastante malo, para que salga bien es importante que se use la
tcnica de la precarga, que consiste en bajar las imgenes al cargar la pgina, para que al pasar el
mouse por encima, el cambio sea automtico, y no tarde mucho tiempo en cambiarse, el script sera
as:
<html>
<head>
<title>Script de Cambio de imgenes con evento onMouseOver y tcnica Precarga</title>
<script language="JavaScript" type="text/javascript">
<!-var mousefuera = "";
var mousedentro = "";
function Precarga()
{
mousefuera = new Image(181,29);
mousedentro = new Image(181,29);
mousefuera.src = "imagen1.gif";
mousedentro.src = "imagen2.gif";
}
//-->
</script>
</head>
<body onLoad="Precarga()">
<center>
<a href="javascript:alert('El vnculo lo diriges donde quieras');"
onMouseOver="imagen.src = mousedentro.src"
onMouseOut="imagen.src = mousefuera.src">
<img src="imagen1.gif" name="imagen" border=0 width="181" height="29">
</a>
</center>
</body>
</html>
En el ejemplo anterior se incluye un nuevo objeto que es Image(a,b), donde a es el ancho de la
imgen, y b es el alto, y despus se le da el atributo .src para que la imgen se cargue, luego creamos la

imgen y las etiquetas de hipervnculo, y a la imgen le damos un nombre y a las etiquetas de vnculo,
les asociammos los eventos onMouseOver y onMouseOut, de tal forma que el script, creado hara algo
as:

Ahora vamos a tratar el evento onLoad que se ejecuta al cargarse la ventana:

Dentro de etiquetas <Script></Script>.
function Abrir()
{
var publicidad = window.open("","msgWindow","menubar=no,directories=no,width=400,height=400");
publicidad.window.location = "banners.html"; // Poner la pgina que se quiera
}
Y en la etiqueta <BODY ...> aadir:
onLoad="Abrir()"

Les recomiendo intenten inventarse ejemplos, para desarrollar sus dotes como programadores
JavaScript que son, aunque de todas formas en los anexos del tutorial encontrarn mltiples ejemplos

Pgina1
: 4

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt
sobre Scripts tpicos que puedan usar en su web, aunque saben que si en algn momento tienen alguna
duda, pueden mandarme un e-mail.

Captulo 6: Arrays
Qu es un Array? Se preguntarn... Pues un array, es un grupo de variables que se denominan con
un mismo nombre y un nmero ( para diferenciarlas unas de otras ), esto lo entendern muy bien
cuando lean algn ejemplo:
var miarray = new Array();
miarray[0] = 'Esto es el primer elemento.';
miarray[1] = 'Esto es el segundo elemento.';
miarray[2] = 'Esto es el tercer elemento.';
...

Noten que el primer elemeno es el mmero 0, el segundo es el 1, y as sucesivamente, por supuesto

podemos manejar muchos elementos en un array, no slo 3 o 4, tendr todos los que quieran.
Imaginemos que queremos cargar las imgenes que cada una es un nmero, lo podramos hacer as:
var imagenes = new Array();
function Precarga()
{
for ( var i = 0 ; i <= 9 ; i++ )
{
imagenes[i] = new Image();
imagenes[i].src = 'images/'+i+'.gif';
}
}

Esto cargar 10 imgenes, 0.gif, 1.gif, 2.gif, etc... que se guardan en un array que se llama imagenes.
Y al fin, el ejemplo final... El Buscador. Este Script, es un buscador que guarda sus registros en un
array, y que busca palabras concretas, no es muy eficiente, pero su potencia es grandsima, quiero
decir, que si el nmero de registros es muy grande, ser un buen buscador, y adems usted investiga
cmo hacerlo para que soporte ms palabras clave, es un buscador muy potente, pero si usa el mismo
que aqu le pongo, por supuesto tendr usted un buscador OBSOLETO. Ah va:
<HTML>
<HEAD>
<title>Buscador JavaScript</title>
<script language="JavaScript" type="text/javascript">
<!-var resultado = '';
var codigo = '';
var Clave = new Array();
var Url = new Array();
var Descripcion = new Array();
Clave[0] = "juegos";
Url[0] = "http://www.upss.go.to/";
Descripcion[0] = "Sitio Web con mltiples cosas sobre consolas y Sobre HTML y JavaScript";
Clave[1] = "natacion";
Url[1] = "http://www.cnlasrozas.nav.to/";
Descripcion[1] = "Sitio con mucha informacin sobre natacin.";
Clave[2] = "javascript"
Url[2] = "http://www.tusitio.com/";
Descripcion[2] = "Aqu puede ir tu sitio";

Pgina1
: 5

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt
// Pon todas las que quieras...
function Busca( str )
{
if ( str == '' || str == null )
{
window.alert('No tengo nada que buscar.');
document.busqueda.cadena.focus();
}
else
{
resultado = window.open('','msgWindow','status=no,menubar=no,width=400,height=400');
codigo += '<html><head><title>Resultados</title></head><BODY link=blue vlink=blue alink=blue>';
codigo += '<h3><center>De la cadena: <i>'+str+'</i>.</center></h3>';
codigo += '<hr width=50%>';
for ( var i = 0 ; i <= Clave.length ; i++ )
{
if ( str == Clave[i] )
{
codigo += "<li><a href="+Url[i]+">Url</a><br>";
codigo += Descripcion[i]+"</li>";
}
}
codigo += '<form><center>';
codigo += '<input type=button value=Cerrar onClick="window.close(self)">';
codigo += '</center></form></body></HTML>';
resultado.document.write(codigo);
}
}
//-->
</script>
</HEAD>
<BODY>
<form name=busqueda>
<input type=text name=cadena><br>
<input type=button value=Buscar onClick="Busca(busqueda.cadena.value);"><br>
</form>
</BODY>
</HTML>

Es quiz un cdigo un poco ms largo de lo que estamos acostumbrados a programar, pero si se fijan
e intentan entenderlo paso a paso, es un cdigo bastante sencillo. Lo primero generamos la pgina con
el formulario de bsqueda, y damos a un botn la propiedad de que al ser pulsado enve a la funcin
Busca ( str ), un parmetro que es la entrada del formulario. Esta funcin comprueba la "Base de Datos",
que no es ms que un conjunto de arrays que se relacionan estre si. Para comprobarla, usa un bucle for,
al cual se le anida una sentencia if, si es correcto se le aaden las entradas a la variable codigo, y al final
se abre una ventana a la cual se le escribe codigo. Si no lo entienden, les pido que me escriban un email. El ejemplo creado, muestra una pgina tal que as:

Captulo 7: Trabajando con Frames y operador Ternario ( ?: )

Por supuesto, JavaScript permite modifcar la Url de los frames de una pgina, el ancho, y muchas
cosas, de todas formas no vamos a introducirnos mucho por este tema. Repasemos un poco la teora
sobre los frames que todos deberan saber antes de leer este captulo. Existe una pgina padre, donde
estn declarados los frames, y desde la misma son llamados, a estos se les llama hijos, para
JavaScript parent y al resto por sus nombres. Supongamos que tenemos una ogina padre con el
siguiente cdigo:

Pgina1
: 6

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt
index.html
<html>
<head>
<title>Menu</title>
</head>
<frameset rows="40,*" frameborder=0 framespacing=0>
<frame src=menu.html name="menu" scrolling="no">
<frame src=index2.html name="cambiado">
</frameset>
</html>
index2.html
<html>
<head><title>Titulo</title></head>
<body>
<p><center>ESCOGE UNA OPCI&Oacute;N</center></p>
</body>
</html>
menu.html
<html>
<head>
<title></title>
<script src="cambio.js"></script>
</head>
<body>
<form name=menu>
<center>
<input type=button value="Buscador" onclick="Cambia(../lesson06','#busca')">
<input type=button value="Diseo Web" onclick="Cambia('webdes','')">
<input type=button value="Trucos" onclick="Cambia('tricks','')">
<input type=button value="JavaScript" onclick="Cambia('../index')">
<input type=button value="Otro" onclick="Cambia('unomas','')">
</center>
</form>
</body>
</html>
cambio.js
function Cambia(url,mas)
{
parent.cambiado.window.location=url+'.html'+mas;
}

Antes de continuar, les ensear una forma de no tener que incluir el cdigo JavaScript en la pgina
HTML, es con la etiqueta script a la cual se le dar el atributo src cuyo valor ser la Url del archivo con
extensin .js que contiene el cdigo, es muy til, pues despeja mucho la pgina, como podreis
observar, he incluido esta sentencia en la cuarta lnea del cdigo de menu.html para que se vayan
familiarizando con esta sentencia. Este ejemplo lo pueden ver pulsando aqu ------->
Un ltimo concepto sobre frames, JavaScript, guardar todos los frames en un Array llamado
frames, segn el orden de declaracin empezando por supuesto por el cero, por ejemplo en nuestra
pgina el elemento document.frames[0]sera el frame del menu.
Vayamos al operador ternario ( ?: ), este se usa con la siguiente sintaxis:
( expresion booleana ) ? resultado1 : resultado2;

Se ejecutar resultado1 si la expresin es verdadera, y de lo contrario se ejecutar la

resultado2.Ejemplo:
var navegador = (document.all) ? explorer : netscape; Se puede observar que el cdigo anterior es equivalente a
lo siguiente:
var navegador;
if (document.all) navegador = "explorer";
else navegador = "netscape";

Pgina1
: 7

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt
Veamos un ejemplo de utilizacin que nos puede ahorrar muchos quebraderos de cabeza y mltiples
lneas de cdigo:
var isIE = (document.all) ? true : false;
var isNN = (document.layers) ? true : false;

El cdigo anterior inicializa dos booleanos,isIE y isNN, el primero tendr el valor true, en caso de que
document.all sea cierto, es decir, si el navegador es Microsoft Internet Explorer, de cualquier otro modo,
tomar el valor false, lo mismo ocurre con isNN, pero con la expresin document.layers, que ser cierta
cuando el navegador se trate de Netscape Navigator. Pero noten la potencia de este operador, podemos
tener varias expresiones, de la siguiente forma:
var isIE4sup = (document.all && navigator.appVersion.charAt(0) >= 4) ? true : false;
var isNN3sup = (document.layers && navigator.appVersion.charAt(0) >= 3) ? true : false;

Se pueden hacer infinidad de cosas con este operador, pero como con todo, eso tiene que surgir del
propio programador. Les ensear un ejemplo prctico para la deteccin del navegador:
function Detecta()
{
var isIE4sup = (document.all && navigator.appVersion.charAt(0) >= 4) ? true : false;
var isNN3sup = (document.layers && navigator.appVersion.charAt(0) >= 4) ? true : false;
if (isIE4sup) alert('Ests usando el navegador MSIE 4.0 o superior.');
else if (isNN3sup) alert('Ests usando el navagador Netscape 3.0 o superior.');
else alert('No usas ni MSIE ni Netscape.');

Captulo 8: Iniciacin a objetos, split y exmen.

Les explicar de una forma muy simple cmo trabajar con objetos en JavaScript; como me parece
que explicar la definicin de objeto ser engorroso, simplemente les dir que son un grupo de variables
y mtodos que trataremos de una forma determinada; sin ms dilacin, les enseo el primer ejemplo:
function Persona(nombre,email)
{
this.nombre = nombre;
this.email = email;
return this;
}
var yo = new Persona('Ferdy','[email protected]');
window.alert("Nombre: "+yo.nombre+"\nE-Mail: "+yo.email);

Veamos cmo podemos potenciar el buscador de forma que guardemos todos los registros en un
array que contenga objetos de un tipo, en lugar de tener tres o ms array's:
<HTML>
<HEAD>
<TITLE>Buscador optimizado con objetos</TITLE>
<SCRIPT language="JavaScript" type="text/javascript">
<!-var Registros = new Array();
function Registro ( clave , descripcion , url )
{
this.clave = clave;
this.descripcion = descripcion;
this.url = url;
return this;
}
Registros[0] = new Registro('javascript','Sitio con mucho sobre JavaScript','http://loquesea.com/');
// Introduce los que quieras ...

Pgina1
: 8

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt
function Busca(str)
{
if ( str == '' || str == null )
{
window.alert('No tengo nada que buscar.');
document.busqueda.cadena.focus();
}
else
{
resultado = open("" , "msgWindow" ,'status=no,menubar=no,width=400,height=400');
codigo += '<html><head><title>Resultados</title></head><BODY link=blue vlink=blue alink=blue>';
codigo += '<h3><center>De la cadena: <i>'+str+'</i>.</center></h3>';
codigo += '<hr width=50%>';
for ( var i = 0 ; i <= Clave.length ; i++ )
{
if ( str == Registros[i].clave )
{
codigo += "<li><a href="+ Registros[i].url +">Url</a><br>";
codigo += Registros[i].descripcion +"</li>";
}
}
codigo += '<form><center>';
codigo += '<input type=button value=Cerrar onClick="window.close(self)">';
codigo += '</center></form></body></HTML>';
resultado.document.write(codigo);
codigo = '';
}
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<FORM name=busqueda>
<INPUT TYPE=text name=cadena>&nbsp;&nbsp;
<INPUT TYPE=button onClick="Busca(this.form.cadena.value)" value="Buscar">
</FORM>
</BODY>
</HTML>

Conozcamos la funcin split(), esta funcin se usa de la siguiente forma:

ObjCadena.split(separador);

y devuelve un array temporal en el cual cada uno de sus elementos son las subcadenas que se
encuentran o desde el principio de la cadena hasta separador, o entre separadores, o entre separador y
el final. Ejemplo:
var cadena = 'El Programador|El Novato|El Experimentado'.split('|');
window.alert(cadena[0]+'\n'+cadena[1]+'\n'+cadena[2]);

Se preguntarn si esto tiene alguna utilidad, pues pensarn que sera ms fcil que declarasemos el array
desde un principio, pues no, pues el array se quedara en memoria todo el tiempo, y esto se hara de forma
temporal.
Ahora saben lo suficiente JavaScript como para entender la funcin que los programadores
JavaScript usamos en su da cuando los Arrays no estaban implementados:
function initArray()
{
this.length = initArray.arguments.length;
for (var i = 0 ; i < this.length ; i++)

Pgina1
: 9

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt
{
this[i] = initArray.arguments[i];
}
}

No es recomendable usarla, puesto que no tiene mucha funcionalidad.

Por ltimo veremos una subrutina que ordena un Array aleatoriamente, mejor dicho, desordena:
for ( var i = 0; i < miArray.length; i++)
{
var j = Math.floor(Math.random() * miArray.length);
var temp = miArray[i];
miArray[i] = miArray[j];
miArray[j] = temp;
}

Pruebe el Script pulsando el botn de abajo:

Les ensear ahora a incluir mtodos ( funciones ) a los objetos que creen. Simplemente tiene que
darle al elemento del objeto el nombre de una funcin definida, como es costumbre, les ensear un
ejemplo:
function Incremento()
{
this.cont++;
return this;
}
function Contador()
{
this.cont = 0
this.Incremento = Incremento;
return this;
}
var num = new Contador;
num.Incremento();
window.alert(num.cont);

Este captulo me contiene un ejercicio que os teneis que currar, ah va:

1. Pgina que contenga un formulario, que valide que todas las entradas estn rellenadas correctamente, y
que una vez relleno, abra una ventana en la cual escriba los datos introducidos por el usuario.
Solucin
Bueno, les he preparado un pequeo exmen en JavaScript, consta de 15 preguntas, pero en realidad
son ms de 20, y saldrn en orden aleatorio, el exmen no tine NINGN VALOR LEGAL,
simplemente es para que ponga a prueba lo que ha aprendido en estos 8 mortales captulos, adems
recomiendo revisen los Anexos del tutorial donde se documenta todo lo nencesario para conseguir
sacar adelante sus dotes como programador de JavaScript, el exmen est programado en JavaScript, y
he de decir que es fcilmente crackeable quiero decir que es muy fcil saber cul ser la respuesta
correcta simplemente con un editor de textos, pero no les dir como para que no hagan trampas. He de
remarcar que el cdigo del Exmen no es mo, quiero decir que lo saque de un buen libro de casa, as
que dicho lo dicho, si quieres probar tus dotes como programador JavaScript, ests totalmente invitado
a examinarte.

Pgina2
: 0

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt

Anexo 1: Operadores.
Bueno, intentar explicar de una forma sencilla qu son los operadores. Los operadores son
comandos que usamos para: modificar, comparar, ... variables; entonces encontramos los operadores
matemticos:
+
Suma dos variables, si son cadenas, las concatena.
Resta dos variables numricas
/
Divide dos variables numricas
*
Multiplica dos variables numricas
%
Resto de la divisin entera de dos variables numricas
++
Incrementa la variable en 1
-Decrementa la variable en 1
De los operadores anteriores, pondr un ejemplo de cada uno:
var y = 1;
var x = 289;
var res = x + y; // res vale 290
var y = 5;
var x = 34;
var res = x - y; // res vale 29
var y = 5;
var x = 4;
var res = x * y; // res vale 20
var y = 25;
var x = 5;
var res = y / x; // res vale 5
var y = 10;
var x = 4;
var res = y % x; // res vale 2
var x = 0;
x++; // x valdr 1 cuando se ejecute la siguiente sentencia
var x = 45;
++x; // x valdr 46 en este momento
var y = 34;
y--; // y valdr 33 cuando se ejecute la siguiente sentencia
var y = 23;
--y; // y valdr 22 en este momento

Pero estos operadores se pueden abreviar de la siguiente forma:

var x = 4;
var y = 34;
x += y; // esto es igual que x = x + y; con lo que x valdr 38
// lo mismo nos ocurre con el resto de los operadores, -= *= /= %=

Existen los llamados operadores de comparacin:

<
Menor que...
>
Mayor que...

!=
==

Distinto que...
Igual que...

Pgina2
: 1

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt
>=
Mayor o igual que...
Ejamplos de los anteriores:

<=

Menor o igual que...

var x = 45;
var y = 34;
if ( x < y ) // la sentencia es falsa
if ( x > y ) // la sentencia es verdadera
if ( x == y ) // la sentencia es falsa
if ( x != y ) // la sentencia es verdadera
if ( x <= y ) // la sentencia es falsa
if ( x >= y ) // la sentencia es verdadera
// note que se podra usar cualquier sentencia que no fuera if.

Otro tipo de operadores son los llamados operadores bit a bit:

~
Operador NOT ( bit a bit )
|
^
Operador XOR ( bit a bit )
&
>>>
Unsigned Cambio a la derecha ( bit a bit )
!
<<
Cambio a la izquierda ( bit a bit )
>>
Se usan para cifrados de datos, y manipulacin de cadenas.

Operador OR ( bit a bit )

Operador AND ( bit a bit )
Operador NOR ( bit a bit )
Cambio a la derecha ( bit a bit )

var cadena = "Hola a todos";

var clave = "Esto deberia ser secreto";
var cifrado = cadena << clave;

Pero no es muy comn el uso de cifrado con JavaScript, pues la clave est en claro.
Tambin podemos encontrar los operadores lgicos:
===
Operador de identidad
!==
Operador de desidentidad
||
Operador OR ( lgico )
&&
Operador AND ( lgico )
?:
Operador ternario
Los operadores de Identidad y Desidentidad son como los operadores de Igualdad y Desigualdad, a excepcin
de que no se realiza conversin de tipos de datos. ( no son muy comunes ).
// ( sentencia ) operador ( sentencia )
var x = 35;
var y = 5842;
var booleano = true;
(( x < y ) && ( booleano )) // sera lo mismo que...
( x < y && booleano )
// cualquier posibilidad es vlida

Anexo 2: Funciones avanzadas de JavaScript y objeto Math.

En este anexo, me dedicar a explicar algunas funciones que nos harn la vida ms fcil, y nos
ahorrarn varios quebraderos de cabeza. Las primeras que explicar nos valdrn para convertir una
cadena de caractres en un nmero o comprobar si la cadena es numrica o no:
parseInt( cadena , idx ): Devuelve un nmero sacado de Cadena en base idx. Por ejemplo:
parseInt("Hola"); // Devuelve NaN
parseInt("12hola"); // Devuelve 12

parseFloat( cadena ): Devuelve un nmero con coma flotante sacado de Cadena. Por ejemplo:
parseFloat("Hola"); // Devuelve NaN
parseFloat("1.2hola"); // Devuelve 1.2

Pgina2
: 2

M
Maannuuaall pprrccttiiccoo ddee JJaavvaaSSccrriipptt
isNaN( variable ): Devuelve true si variable es NaN, es decir, si no es un nmero, y false si variable es
numrica. Por ejemplo:
isNaN("Hola"); // Devuelve true
isNaN("12");
// Devuelve false

Empezaremos a usar el objeto Math, este objeto, tiene muchas funciones muy potentes, desde la ms
sencilla funcin de devolver el valor absoluto de un nmero, hasta generacin de nmeros
pseudoaleatorios, pasando por funciones trigonomtricas, etc...aqu slo explicar unos pocos:
//-----------------------------------------------------------------// Math.abs ---> devuelve el valor absoluto de un nmero:
Math.abs('-5'); // devuelve 5
Math.abs('5); // devuelve 5
//-----------------------------------------------------------------// Math.cos ---> devuelve el coseno de un ngulo
Math.cos('45') // devuelve 0.5253219888177297.
//-----------------------------------------------------------------// Math.sin ---> devualve el seno de un ngulo
Math.sin('45'); // devuelve 0.8509035245341184
//-----------------------------------------------------------------// Math.ceil ---> devuelve el nmero entero mayor o igual a el.
Math.ceil('0.03324'); // devuelve 1
//-----------------------------------------------------------------// Math.floor ---> devuelve el nmero entero menor o igual a el.
Math.floor('5.2368'); // devuelve 5
//-----------------------------------------------------------------// Math.random ---> devuelve un nmero pseudoaleatorio entre 0 y 1 inclusive.
Math.random() // por ejemplo 0.1438574885700009
//-----------------------------------------------------------------//Math.pow ---> devuelve el resultado de elevar el primer argumento al segundo
Math.pow('10','3'); // devuelve 1000
//-----------------------------------------------------------------//Math.sqrt ---> devuelve la raz cuadrada de un nmero
Math.sqrt('400'); // devuelve 20
//------------------------------------------------------------------

Ejemplo prctico: Utilizacin de el objeto Math, para desplegar banners publicitarios aleatoriamente,
usando los mtodos random y ceil o floor:
var banners = new Array();
banners[0] = 'images/banner1.gif';
banners[1] = 'images/banner2.gif';
banners[2] = 'images/banner3.gif';
banners[3] = 'images/banner4.gif';
function Selecciona_Banner()
{
var num = Math.ceil( Math.random() * banners.length-1 );
document.write('<a href=\"loquesea\"><img src='+banners[num]+' border=0></a>');
}

Pgina2
: 3