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 código se incluye directamente en el mismo documento HTML.
Hasta entonces ya se usaba HTML y JAVA, pero la aparición del JavaScript produjo una importante revolución, ya que dio al usuario la posibilidad de crear aplicaciones "on-line" osea modificar páginas web en tiempo real, sin usar CGI's.
Si bien hoy en día, JavaScript, es un lenguaje muy usado, sus principales aplicaciones son:
Aunque según pasa el tiempo sus aplicaciones se van incrementando.
Antes siquiera de que conozcamos la sintaxis o una primera orden de JavaScript, debemos saber primero cómo se incluye un script dentro de un documento HTML.
Hay otra manera de ejecutar código JavaScript y es directamente en la ventana de un navegador, es decir donde se pondría la URL. Pruebalo poniendo por ejemplo: javascript:nombre="Juan";window.alert("Mi nombres es "+nombre);. Funciona, pero claro es muy tonto porque no se almacena en ningún lado por lo que hay que escribirlo cada vez.
El código JavaScript se inserta directamente en nuestra pagina HTML. Hay cuatro (4) maneras de hacerlo:
Los comandos de JavaScript son evaluados inmediatamente al cargarse la pagina. Las funciones son almacenadas, pero no ejecutadas, hasta cierto evento. Ejemplo: onClick,onMouseOver,etc
<etiqueta evento='comando javaScript;'>
<!doctype htm> <Html> <Head> <Title>Titulo</Title> </Head> <Body> <a href="" onMouseOver="window.status='Figura';return true"> <IMG SRC=fig.gif></A> </Body> </Html>
Nota que aquí es el evento onMouseOver el que dispara la acción.
<button onClick="alerta('Cuidado')">Borrar</button>
Nota que aquí es el evento onClick el que dispara la acción.
Es decir entre las etiquetas <BODY> y </BODY> usando la etiqueta SCRIPT
<Script type='JavaScript'> ... </Script>
<!doctype htm> <Html> <Head> <TITLE>Titulo</TITLE> </Head> <Body> <Script type='JavaScript'> <!-- escondemos el código> document.write("Hola que tal"); // hasta aqui escondo --> </Script> </Body> </Html>
Este código se ejecuta inmediatamente al cargar la pagina y lo que produce es un texto sobre la pagina, para ello use el método write del objeto document, que representa al documento actual.
Nota que use un comentario <!-- --> para ocultar el código a los navegadores que no soportan JavaScript.
En este caso todo el código del script esta situado en otro archivo y se hace una llamada.
<Script src='nombre archivo'> </Script>
<!doctype htm> <Html> <Head> <Title>Titulo</Title> </Head> <Body> <Script src=codigo.js> </Script> </Body> </Html>
Nota que aquí no fue necesario esconder ningún código y que los navegadores que no soporte la etiqueta Script simplemente lo ignoraran.
Dentro de la cabecera, después del titulo. Es decir, entre las etiquetas </TITLE> y </HEAD> y luego la llamada a la función en el cuerpo.
<!doctype htm> <Html> <Head> <Title>Titulo</Title> <Script> <!-- escondemos el codigo> funcion llamada(x){ alert("Le dije que NO!"+x); } // hasta aquí escondo --> </Script> </Head> <Body> No haga Clic <A HREF="JavaScript:llamada('Curioso!')">AQUI</A> </Body> </Html>
Observa que aquí se definió la función en la cabecera, pero recién se ejecuta al hacer clic en el enlace, que es el evento que llama a la función a la cual se le para un parámetro.
Excepto en texto entrecomillado, JavaScript es sensible a mayúsculas y minúsculas, por lo que tendrás que tener el cuidado al usar por ejemplo document.write de escribirlo así, en minúsculas o no se interpretara. Cualquier error simplemente es ignorado. Se puede usar la comillas simple para los valores de atributos.
Es muy importante que respetes las comillas. Puedes usar comillas simples o dobles y combinación de ellas.
evento="objeto.método('dato')"; //Combinación alterna evento='objeto.método("dato")'; //Combinación alterna evento="objeto.método(\"dato\")"; //Método escapado evento='objeto.método(\'dato\')'; //Método escapado
Puedes escribir comentarios entre el código JavaScript, igual que puedes en CSS. En JavaScript, los comentarios de una sola línea se escriben así:
//Esto es un comentario /* Este es un comentario de múltiple linea. */
Si tienes dudas de como funciona un código JavaScript lo mejor es que o pruebes en linea para eso usa paiza.io
var x = 10; if (x > 5){ console.log("Si, es mayor"); }else{ console.log("No, no es mayor."); }