Variables
 
Las variables son palabras que se incluyen en el c?digo Javascript que incluyen informaci?n que tu desees, su principal uso es para simplificar el uso de informaci?n larga y para almacenar informaci?n que obtengamos del usuario.

Para establecer una variable simplemente escribe el nombre que tu quieras para la variable luego un signo de igual (=) y finalmente el valor inicial que tendra, este valor puede cambiar las veces que desees.
 
 Ejemplo:
(boton para ver la URL de esta pagina)

<script language="Javascript">
<!--
function ver(){
variable_1 = window.location
alert ( variable_1 )
}
-->
</script>

<form><center><input type="button"
value="Click aqu? para observar el URL de esta p?gina" onclick="ver()"></p>
</center>
</form>

Como vemos en la variable_1 se guarda la informaci?n sobre el URL de esta p?gina que obtenemos con window.location, posteriormente mostramos el valor de variable_1 en el mensaje de alerta que se muestra con alert(), dentro del par?ntesis va el nombre de la variable_1 y por lo tanto ese es el valor que se muestra.
 


                   

Las funciones en Javascript son, por as? decirlo, una lista de procedimientos que se ejecutar?n cuando nosotros lo indiquemos. Esto sirve para evitar que todas las instrucciones que nosotros indiquemos en el programa se ejecuten al principio. Por ejemplo si queremos que se muestre un mensaje de alerta cada vez que el usuario da click en un hiperv?nculo, ponemos el mensaje de alerta dentro de una funci?n y luego en el hiperv?nculo escribimos el nombre de la funci?n para que se active cada vez que demos click, un ejemplo:

<script language="JavaScript">
function mensaje(){
alert("^CaNiVaL^")
}
</script>

<a href="javascript: mensaje()">^Prueba el mensaje de alerta^</a>


Para crear una funci?n primero se escribe la palabra function, despu?s el nombre que nosotros queramos (mensaje) y a continuaci?n unos par?ntesis (), la rutina de la funci?n va encerrada entre { }
Entonces para crear la funci?n escribimos function mensaje(), la rutina a seguir va encerrada entre { }, es decir ?{ alert("Mensaje de alerta.....") }, podemos crear todaa las funciones que queramos y dentro de las funciones pueden ir todos los m?todos que nosotros eligamos.

Para llamar a la funci?n debemos escrbir un hiperv?nculo, primero con la palabra Javascript, luego dos puntos : y por ?ltimo el nombre de la funci?n junto con los par?ntesis ().
El resultado es Javascript : mensaje ( ),Si queremos que la funci?n se active con un evento ponemos el nombre de la funci?n junto con los par?ntesis, todo dentro de comillas, ejemplo:

<img onload="funcion ( )">

Si llamamos a la funci?n dentro de un c?digo Javascript entonces quitamos las comiilas y los parentesis, ejemplo:

<script language="Javascript"><!--
document.onload= funcion
--></script>

Bueno por ahora vamos bien, deja la pereza a un lado y continuemos jeje...                    

Casi todos los ejemplos aqu? mostrados activar?n la funci?n aviso() que es la siguiente:


<script language="javascript"><!--
function aviso(){
alert("Esto sucedio")
}
</script>

(la cual debes crear para que funcione jeje..) pruebalos en un block de notas. Bueno sigamos...

• Abort
  Implementado para: Image
  onAbort = " funcion ( ) ";
  Sucede cuando detienes la descarga de una imagen
  C?digo de ejemplo para una imagen web:
  
  <img src="x.gif" onAbort="aviso()">
  
  [li]Blur
  Implementado para: button, checkbox, fileupload, layer, password, radio, reset, select, submit, text, textarea, window
  onBlur="funcion ( )";
  Un elemento de un formulario deja de tener el foco (el cursor que parpadea para poder escribir o cuando es seleccionado)
  Codigo de ejemplo para un cuadro de texto:
  
  <form>
  <input type="text" size="20"
  onBlur="aviso()">
  </form>
  Ejemplo (da click sobre el cuadro de texto y posteriormente da click fuera de ?l):
  
  [li]Change
  Implementado para: Fileupload, select, text, textare
  onChange ="funcion ( )";
  El contenido de un elemento de formulario cambia de valor.
  
  <form>
  <input type="text" size="20"
  value="Cambia el contenido"
  onChange="aviso()">
  </form>
  
  En el siguiente ejemplo cambia el texto que dice y luego da click en la parte de afuera del cuadro de texto:
  
  [li]Click
  Implementado para: button, document, checkbox, link, radio, reset, submit
  onClick = "funcion ( )"
  El usuario hace click con el mouse sobre un ?formulario, una imagen, un link o cualquier elemento
  
  <form>
  <input type="button" value="Click"
  onClick = "aviso ( )">
  </form>
  
  Da click en el siguiente bot?n para que se active la funci?n
  
  [li]dblClick
  Implementado para: document. link
  ondblClick = "funcion ( )"
  Lo mismo que con el evento Click solo que aqu? es doble click
  
  <form>
  <input type="button" value="Doble Click"
  onDblClick = "aviso ( )">
  </form>
  
  [li]DradDrop
  Implementado para: window
  onDragDrop ="funcion ( )"
  El usario suelta un objeto sobre la p?gina, se realiza con la acci?n de arrastrar y soltar
  
  Nota: Este evento no ha funcionado correctamente en Netscape ni en Explorer
  
  [li]Error
  Implementado para: Image, window
  onError = "funcion ( )"
  Sucede un error en la transferencia del archivo o imagen
  
  <img src="y.gif" onError= "aviso ( )">
  
  [li]Focus
  Implementado para: button, checkbox, fileupload, layer, password, radio, reset, select, submit, text, textarea, window
  onfocus = "funcion ( )"
  Un elemento recibe el foco por parte del usuario. Se aplica especialmente en cuadro de texto y area de texto, un elemento recibe foco cuando ese elemento se encuentra activo.
  
  <input type="text" size="20" value="da click aqu?" onFocus="aviso ( )">
  
  [li]Keydown
  Implementado para: document. image, link, textarea
  onKeyDown ="funcion ( )"
  El usuario presiona una tecla, el evento se activa cuando la tecla llega abajo.
  
  [li]KeyUp
  Implementado para: document. image, link, textarea
  onKeyUp = "funcion ( )"
  La tecla llega hacia arriba
  
  [li]KeyPress
  Implementado para: document. image, link, textarea
  onKeyPress= "funcion ( )"
  La tecla es presionada totalmente, tambi?n se activa si el usuario mantiene la tecla presionada.
  
  <script language="javascript"><!--
  
  document.onkeydown = aviso
  document.onkeyup=aviso2
  document.onkeypress = aviso3
  
  --></script>
  
  Nota: Como pudes observar pusimos las tres funciones juntas dentro de un c?digo Javascript, es por eso que para llamar a la funci?n omitimos las comillas (" ") y los par?ntesis ( ).
  Si deseas que la funci?n sea activada cuando el foco esta sobre un elemento entonces debes de poner el nombre de la funci?n con los par?ntesis y dentro de las comillas.
  
  

continua..                    

Con los nuevos navegadores existentes es necesario que al crear los c?digos Javascript tomemos en cuenta las diferencias entre ellos. Para esto existen algunas funciones que nos dan informaci?n sobre el navegador que el usuario utiliza.

Las formas de llamar a los elementos desde Javascript cambia dependiendo del navegador, eso tambi?n lo veremos pero primero observaremos como detectar el nombre y la versi?n del navegador.

navigator.appName = Microsoft Internet Explorer
Este comando nos dice el nombre del navegador.

navigator.appVersion = 4.0 (compatible; MSIE 5.0; Windows 98; DigExt)
Contiene el n?mero de la versi?n del navegador, debes de darte cuenta que con cada diferente versi?n aumentan algunos c?digos y otros son eliminados, por ejemplo el evento image.onload funciona en Netscape 4.04 pero no en versi?nes anteriores.

navigator.userAgent = Mozilla/4.0 (compatible; MSIE 5.0; Windows 98; DigExt)
Contiene casi toda la informaci?n sobre el navegador, veremos un ejemplo.

<!-- Principio del c?digo -->

function Is( ) {
 ?var agent = navigator.userAgent.toLowerCase();
 ?this.major = parseInt(navigator.appVersion);
 ?this.minor = parseFloat(navigator.appVersion);
 ?this.ns = ((agent.indexOf(\'mozilla\')!=-1) && ((agent.indexOf(\'spoofer\')==-1) && (agent.indexOf(\'compatible\') == -1)));
 ?this.ns2 = (this.ns && (this.major == 3));
 ?this.ns3 = (this.ns && (this.major == 3));
 ?this.ns4b = (this.ns && (this.minor < 4.04));
 ?this.ns4 = (this.ns && (this.major >= 4));
 ?this.ie = (agent.indexOf("msie") != -1);
 ?this.ie3 = (this.ie && (this.major == 2));
 ?this.ie4 = (this.ie && (this.major >= 4));
 ?this.op3 = (agent.indexOf("opera") != -1);
 ?this.win = (agent.indexOf("win")!=-1);
 ?this.mac = (agent.indexOf("mac")!=-1);
 ?this.unix = (agent.indexOf("x11")!=-1);
}

var is = new Is( );

<!-- Fin del c?digo --->

Para saber si el usuario usa la versi?n que queremos lo detectamos por medio de la variable
is.ie4 si el usuario usa Internet Explorer 4 la variable ser? true, podemos detecatar as? si ?utiliza Netscape 2 (is.ns2), tambi?n el sistema operativo (is.win) y todas las variables que se muestran en el c?digo de arriba como this, recuerda que debes de cambiar la palabra this[/red] por is, es decir para detectar si el usuario utiliza windows no pondremos this.win sino is.win

Algo muy importante que observamos en el c?digo anterior es el comando parseInt esta funci?n extrae el n?mero entero dentro de una cadena de texto, es decir, si el valor es Variable = "4.90 Jk" con el comando Variable = parseInt ( "4.90 jk") nos dar?n el valor de Variable = 4. Recuerda que las cadenas de texto van entre comillas y los comandos no.

Entre las diferencias entre Netscape y Explorer se encuentra la forma en cambiar una imagen.
Para Explorer es:

document.all.MyPic.src = "dos.gif"

Para Netscape

document.MyPic.src = "dos.gif"

Para la imagen ser?a:

<img src="uno.gif" name = "MyPic" id ="MyPic">

Nota:Seg?n algunos expertos en Explorer para identificar una imagen se utiliza el id y para Netscape name, es preferible utilizar los dos con el mismo nombre para evitar complicaciones.
                   

if... else

La declaraci?n if... else nos sirve para indicar lo que suceder? en caso de que se de un evento o lo que suceder? si no sucede.

La forma general de la condici?n if else es:

if (condicion) {
 ?sucede esto si la condici?n es verdadera
}
else {
 ? ? ?sucede esto si la condici?n es falsa
}

La Condici?n ?puede ser cualquier comando de Javascript o cualquier variable o lo que sea, ejemplo:

if (x == 3) {
alert ( "X es igual a 3 )
}
else {
alert ( "X no es igual a 3")
}

Observemos que el primer mensaje de alerta se dar? solo si la variable x es igual a 3, de otra forma el mensaje de alerta indicar? que x no es igual a 3..
Si quieres a?adir una condici?n al elemento else, entonces escribe else if:

if (x ==3){
alert("X igual a 3")
}
else if (x==4) {
alert ("X igual a 4")
}
else {
alert ("X no es 3 ni 4")
}

En este ejemplo, si x no es igual a 3 ni tampoco a 4 entonces se ejecutar? el ?ltimo mensaje de x no es 3 ni 4. En estos ejemplos se utiliza el doble signo de igual (= =). En el post anterior se explicaron los operadores..

======================================================

for

La declaraci?nfor sirve para establecer un ciclo manejado por una variable que consiste en tres par tes principales: la variable de inicio, hasta cuando terminar? y la manera de aumentar esta variable.

For se declar? de la siguiente manera:

for ( i = 0; i < 9; i++) {
 ? ?// declaraciones
}

Para utilizar esta declaraci?n primero se escribe la palabra for, a continuaci?n y entre par?ntesis se escriben las tres condiciones: primero el valor inicial de la variable, en este caso esi = 0; despu?s la condici?n para que se realizen las declaraciones, o sea, mientras i sea menor que 9 ( i < 9 ) la declaraci?n se efectuar?; y por ?ltimo el incremento o decremento de la variable ( i++ ); las declaraciones son la serie de funciones que se llevar?n a cabo mientras i < 9. Las declaraciones pueden incluir pr?cticamente lo que sea, puede ser funciones o lo que desees. Las declaraciones de las variables van separadas por un punto y coma( ; ), pero las tres van entre par?ntesis. No es necesario que la variable sea i, puede tener el nombre que tu quieras como counter o cualquier palabra que se te ocurra. El valor de la variable, como hemos visto, no tiene que ser necesariamente num?rico, puede ser igual a otra variable o elemento.
Las declaraciones van entre { }

Ejemplo:

for ( i=0; i<14; i++) {
alert ("El valor de i es igual a " + i )
}
crea un botton y ejecuta este ejemplo,aparecera al inciarse la rutina, un mensaje que indicar? el valor actual de i, el mensaje se repetir? hasta que el valor de i sea menor que 14 (i < 14)o sea que el mensaje sera "El valor de i es igual a 0", "El valor de i es igual a 1", etc, no llega hasta 14 porque si no seria (i<=14), para incluir el valor de 14.

======================================================

While

La declaraci?n While evalua una condici?n ?constantemente y mientras sea verdadera, las operaciones contenidas ser?n ejecutadas. El ciclo termina cuando la condici?n se vuelve falsa.

La forma de escribir la declaraci?n While es:

while (condici?n){
// funciones
}
 La condici?n va entre par?ntesis () y las funciones van entre { ?}

Ejemplo:

x = 0
while(x < 3) {
 ?x ++
} ? ? ?
 ? ? ?
En este ejemplo mientras (while) x sea menor que 3 (x<3) x aumentar? en uno (x++), cuando x sea igual a 3,x dejar? de aumentar.
As? la funci?n seguir? ejecutandose hasta que la condici?n se vuelva falsa. Es mas o menos como la declaraci?n For pero en While solo estableces la condici?n.

Terminamos con la Introduccion a JavaScript, ahora continuaremos con Formularios y elementos..

 ? ? ? ? ? ? ? ? ? ? ? ? ? ? ^CaNiVaL^                    

Informaci?n[/size]

Type=Tipo del elemento
Value=Nombre con el que queda
Name=Nombre para reconocer el
Checked=Indica que esta activado elemento

• Nombre:Button
  Html:<input type="button" Value="Mi boton" name="boton1">
  [li]Nombre:CheckBox
  Html=<input type="checkbox" name="check1" value="on" checked>
  [li]Nombre:Hidden
  Html=<input type="hidden" value="oculto" name="Hid1">
  [li]Nombre:Password
  Html=<input type="password" value="pass"(aparece en aster?scos) name="pws" size="14">
  [li]Nombre:Radio
  Html=<input type="radio" value="option1" checked name="Op1"(Indica que esta activada)>
  [li]Nombre:Reset
  Html=<input type="reset" value="Restablecer" name="btorest">
  [li]Nombre:Select
  Html=<select name="D1" size="1">  <option value="numero_uno"> Opcion</option> </select>
  [li]Nombre:submit
  Html=<input type="submit" value="Enviar" name="B1">
  [li]Nombre:Text
  Html=<input type="text" name="T1" size="13" value="Texto">
  [li]Nombre:Textarea
  Html=<textarea rows="2" name="S1" cols="11">Area de texto
  
  
  Para referirse al formulario utilizamos la siguiente l?nea de c?digo: document.nombre_forma
  Entre document y nombre_forma va un punto.
  nombre_forma debe ser sustituido por el nombre de tu formulario
  
  Para referirse a un elemento de un formulario utilizamos la siguiente l?nea de c?digo: document.nombre_forma.nombre_elemento
  Entre nombre_forma y nombre_elemento va un punto
  nombre_elemento debe ser sustituido por el nombre del elemento
  
  La mayor?a de los elementos mostrados arriba manejan tres variables, que son:
  type
  defaultValue
  name[/size]
  *La primera expresa el tipo de elemento de formulario
  *La segunda el valor inicial del elemento
  *La tercera el nombre que le diste al elemento.
                     

Disculpas por la continuacion del curso, en estos momentos he tenido algunos inconvenientes, en el momento que pueda continuar lo hare saber

Gracias y suerte