¿Qué como puedo yo saber que navegador usas? Pues con un poco de JavaScript, por supuesto.
Por favor, lee atentamente las líneas que siguen. La mayoría de
las dudas que se me formulan sobre este curso son debidas a no haberlo hecho.
JavaScript, al igual que Java
o VRML, es una de las múltiples maneras que han surgido para extender
las capacidades del lenguaje HTML. Al ser la más sencilla, es por
el momento la más extendida. Antes que nada conviene aclarar un
par de cosas:
Existen tres versiones de JavaScript. Casi todo lo que hay en este curso funciona con la versión 1.0, que nació con el Netscape Navigator 2.0. Todo aquello que requiera de las versiones 1.1 o 1.2 (que surgieron con las versiones 3 y 4 del Netscape) para funcionar llevarán uno de estos gráficos para indicarlo:
También existe una versión 1.3, introducida en la versión 4.07 (si no recuerdo mal). Esta versión es una pequeña revisión de la 1.2 creada para ajustarse al estándar internacional ECMA que regula el lenguaje Javascript y por su poca importancia no será cubierto aquí.
El Microsoft Explorer soporta el JavaScript, sólo que cambiandole el nombre. La versión 3.0 interpreta el JScript, que es similar al JavaScript 1.0 pero con algunas diferencias para provocar ciertas incompatibilidades (majetes que son los de Microsoft). El Explorer 4 parece que sí que admite JavaScript 1.1 con cierta fiabilidad.
A partir de ahora asumo que quien
esté leyendo esto conoce el HTML. Si no tienes ni idea del mismo,
visita primero
mi curso de HTML.
También asumo que estás familiarizado con
la sintaxis de C, C++ o Java. Si no es así visita
esta
página donde encontrarás un magnífico curso de Java y lee,
en el capítulo llamado Conceptos básicos de Java, los apartados que tratan
la programación en Java y el control de flujo.
Vamos a realizar nuestro primer
"programa" en JavaScript. Haremos surgir una ventana que nos muestre el
ya famoso mensaje "hola, mundo". Así podremos ver los elementos
principales del lenguaje. El siguiente código es una página
Web completa con un botón que, al pulsarlo, muestra el mensaje.
<HTML> <HEAD> <SCRIPT LANGUAGE="JavaScript"> function HolaMundo() { alert("¡Hola, mundo!"); } </SCRIPT> </HEAD> <BODY> <FORM> <INPUT TYPE="button" NAME="Boton" VALUE="Pulsame" onClick="HolaMundo()"> </FORM> </BODY> </HTML>Y aquí está nuestro ejemplo funcionando:
Ahora vamos a ver, paso por paso, que significa cada uno de los elementos extraños que tiene la página anterior:
<SCRIPT LANGUAGE="JavaScript"> </SCRIPT>Dentro de estos elementos será donde se puedan poner funciones en JavaScript. Puedes poner cuantos quieras a lo largo del documento y en el lugar que más te guste. Yo he elegido la cabecera para hacer más legible la parte HTML de la página. Si un navegador no acepta JavaScript no leerá lo que hay entre medias de estos elementos. Así que si programamos algo que sólo funcione con la versión 1.1 pondríamos LANGUAGE= "JavaScript1.1" para que los navegadores antiguos pasen olímpicamente del código y no se hagan un lío.
function HolaMundo() { alert("¡Hola, mundo!"); }Esta es nuestra primera función en JavaScript. Aunque JavaScript esté orientado a objetos no es de ningún modo tan estricto como Java, donde nada esta fuera de un objeto. Para las cosas que se van a hacer en este tutorial, no vamos a crear ninguno, pero usaremos los que vienen en la descripción del lenguaje. En el código de la función vemos una llamada al método alert (que pertenece al objeto window) que es la que se encarga de mostrar el mensaje en pantalla. Por un fallo del Netscape no se pueden poner las etiquetas HTML de caracteres especiales en una función: no los reconoce. Así que pondremos directamente "¡" arriesgándonos a que salga de otra manera en ordenadores con un juego de caracteres distinto al del nuestro.
<FORM> <INPUT TYPE="button" NAME="Boton" VALUE="Pulsame" onClick="HolaMundo()"> </FORM>Dentro del elemento que usamos para mostrar un botón vemos una cosa nueva: onClick. Es un controlador de evento. Cuando el usuario pulsa el botón, el evento click se dispara y ejecuta el código que tenga entre comillas el controlador de evento onClick, en este caso la llamada a la función HolaMundo(), que tendremos que haber definido con anterioridad. Existen muchos más eventos que iremos descubriendo según avancemos en el tutorial. En el cuarto cápitulo hay un resumen de todos ellos.
En realidad, podríamos haber escrito lo siguiente:
<FORM> <INPUT TYPE="button" NAME="Boton" VALUE="Pulsame" onClick="alert('¡Hola,Mundo!')"> </FORM>y nos habríamos ahorrado el tener que escribir la función y todo lo que le acompaña, además de conseguir que nos reconozca el caracter especial ¡. Sin embargo me pareció conveniente hacerlo de esa otra manera para mostrar más elementos del lenguaje en el ejemplo.