Bienvenid@s al primer capítulo del tutorial de Javascript, el objetivo de este tutorial es enseñaros los conceptos
básicos de la programación Javascript, así como el manejo del DOM HTML.
Primeramente decir que Javascript es un lenguaje de programación ampliamente extendido, sobre todo en el
desarrollo web y especialmente trabajando del lado del cliente (navegador), también hay que recalcar que
otras librerías ampliamente conocidas como Jquery o Mootools, entre otras, están escritas en lenguaje
Javascript, también hay que decir que Javascript amplia sus posibilidades de uso y ya también es posible
trabajas con él a través del lado del servidor gracias a la tecnología node.js.
Una vez vista una breve introducción es momento de tener la primera experiencia con el lenguajes para
ello vamos a ver dos formas de incluir código Javascript, una es escribiendo código en el interior de
las etiquetas <script></script> en un documento HTML y otras forma es embebiendo un archivo Javascript con extensión .js.
Para el tutorial crea una carpeta, por ejemplo en el escritorio y llámala tutorial-javascript
Abre un editor de código, uno muy recomendable es notepad++ y guarda un archivo como index.html en la
carpeta que acabas de crear.
En este ejemplo vamos a ver como escribir código Javascript en un documento HTML. Copia y pega el siguiente
código en el archivo index.html ...
<!DOCTYPE HTML>
<html>
<head>
<script>
document.write("Hola Mundo");
alert("Hola Mundo");
</script>
</head>
<body>
</body>
</html>
Ahora guarda index.html y ábrelo en el navegador, verás un resultado como el siguiente ...
Bien, vamos a explicar el código, con document.write estamos realizando una salida de datos en el documento HTML, en este caso
nos muestra el texto que hemos incluído "Hola mundo" y con alert también nos muestra una salida de datos
con el texto que le hemos incluído pero en este caso a través de una alerta.
Ahora vamos a ver otra forma de ejecutar código javascript y para ello vamos a crear una carpeta llamada
javascript en el interior de la carpeta tutorial-javascript, crea un nuevo archivo y guárdalo como prueba.js
en la carpeta que acabas de crear javascript, copia y pégale el siguiente código y lo guardas ...
document.write("Hola Mundo");
alert("Hola Mundo");
Cuando embebamos el archivo prueba.js en nuestro documento index.html vamos a obtener el mismo resultado que
con el código que escribimos en las etiquetas script, para ver lo que sucede modifica el archivo index.html
dejándolo de la siguiente forma ...
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="javascript/prueba.js"></script>
<script>
/*document.write("Hola Mundo");*/
//alert("Hola Mundo");
</script>
</head>
<body>
</body>
</html>
Bien, si observas el código, con la siguiente etiqueta script estamos incluyendo el código javascript que se encuentra en prueba.js, para ello en el atributo src indicamos la ruta ...
<script type="text/javascript" src="javascript/prueba.js"></script>
Y si observas el código que se encuentra entre las etiquetas script, el código ahora se encuentra comentado,
es decir, para realizar comentarios utiliza la siguiente forma ...
/* Comentarios */ // Comentarios
Ahora refresca la página de index.html en el navegador, verás como estás ejecutando código Javascript de un archivo externo,
por supuesto el código comentado ahora no se va a ejecutar, ya que es considerado un comentario.
No hay comentarios:
Publicar un comentario