Scribd
Cargar
144 vistas

05 Primeros Programas en JavaScript

Este documento presenta varios ejemplos básicos de código JavaScript para iniciar la programación de sitios web, incluyendo cómo escribir mensajes, mostrar alertas y capturar datos del usuario. Explica funciones como document.write(), prompt(), confirm() y alert(). También cubre temas como comentarios, operaciones matemáticas, conversión de tipos de datos y el uso de JavaScript dentro de páginas HTML.

Cargado por

Gabriel Sosa
Derechos de autor
© © All Rights Reserved
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
144 vistas

05 Primeros Programas en JavaScript

Este documento presenta varios ejemplos básicos de código JavaScript para iniciar la programación de sitios web, incluyendo cómo escribir mensajes, mostrar alertas y capturar datos del usuario. Explica funciones como document.write(), prompt(), confirm() y alert(). También cubre temas como comentarios, operaciones matemáticas, conversión de tipos de datos y el uso de JavaScript dentro de páginas HTML.

Cargado por

Gabriel Sosa
Derechos de autor
© © All Rights Reserved
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
Está en la página 1/ 7

Primeros Pasos en la Programacin con JavaScript

Introduccin
En este material les expongo algunos programas para iniciarse en la programacin de sitios
WEB auxilindose con JavaScript, este documento les servir como ayuda para la
realizacin del proyecto de este parcial, no ser evaluado en examen escrito pero sus
conocimientos ponen en practica toda la teora de los materiales anteriores.
Por lo tanto recomiendo que pongan en prctica todo lo que aqu se menciona y adems
que complementen con los videos y dems informacin que puedan encontrar en Internet
al respecto.
Los programas en JavaScript van dentro de las pginas WEB (HTML),
as que podremos realizar todos los ejemplos de este material en un
bloc de notas y posteriormente guardar el archivo como un archivo
con extensin HTML como lo hemos venido haciendo desde el
comienzo de esta clase.

Nuestro Primer Programa


Escribir el cdigo siguiente:
<html><body>
<script type="text/javascript">
document.write("Hola programador!!!")
</script>
</body></html>
En la pgina realizada hemos incrustado un script en el cdigo HTML, porqu decimos esto?
Porque el cdigo del script se encuentra en el cuerpo de la pgina, o sea dentro de las
etiquetas <body></body>
Material facilitado por Ing. Gerardo Josu Portillo (gerardo.portillo@uth.hn)

Explicacin del ejemplo:


1. Se comienza con el tag <script>
2. La orden document.write, establece que se escriba en el documento html la frase Hola
programador que debe ir entre comillas dobles o simples.
3. Se finaliza con el tag </script>

Ejemplo mediante un Evento


Escribir el cdigo siguiente:
<html><body>
<FORM>
<INPUT TYPE="button"
NAME="boton"
VALUE="Presione"
onClick="document.write('Hola Programador!!!')">
</FORM>
</body></html>

En este caso incorporamos una expresin javascript en un formulario en donde declaramos


un botn con el texto presione. Al presionar el botn escribe en el documento la frase Hola
Programador.
Primero observen que definimos dos tags: <FORM> y </FORM> con ellos establecemos que
vamos a crear un formulario, a dicho formulario le vamos a poner un botn con el tag
INPUT Type=button.
La expresin onClick es de JavaScript, observen el siguiente detalle:
Luego de onClick = la expresin document.write est entre comillas
dobles y el texto se encuentra en comillas simples.
Esto es porque las comillas dobles encierran a lo que mandamos a llamar con la funcin
onClick que es el evento que se dispara cuando alguien hace click en el botn.
Las comillas simples tambin pueden ser usadas en JavaScript para presentar cadenas de
texto, o sea que en JavaScript tanto las comillas dobles como las comillas simples pueden
usarse para presentar texto y combinarse entre si.

Material facilitado por Ing. Gerardo Josu Portillo (gerardo.portillo@uth.hn)

Ejemplo: Mostrar un Mensaje


Escribir el cdigo siguiente:
<html><body>
<script type="text/javascript">
alert("Bienvenidos a mi pagina")
</script>
</body></html>
Esta pgina mostrar un mensaje de bienvenida al cargar la pgina.

Ejemplo: Mostrar un Mensaje a travs de un Evento


Escribir el cdigo siguiente:
<html><body>
<FORM>
<INPUT TYPE="button"
NAME="boton"
VALUE="Presione"
onClick="alert('Hola Programador!!!')">
</FORM>
</body></html>
Este ejemplo lo que hace es que muestra un botn en la pgina y al hacer click en l
muestra un mensaje.

Material facilitado por Ing. Gerardo Josu Portillo (gerardo.portillo@uth.hn)

Ejemplo: Poner Comentarios a nuestro cdigo


Cuando se escribe un programa, muchas veces es necesario documentar las tareas que
realiza, muchas veces son lneas importantes que no hacen tareas de programacin en s:
<script type=text/javascript>
//comentario de una lnea
/*Comentario que puede abarcar
Ms de una lnea*/
</script>

Ejemplo: Operaciones Matemtica Bsicas


Escribir el cdigo siguiente:
<HTML><HEAD><TITLE>LABORATORIO 1</TITLE></HEAD>
<script>
document.write('texto que saldr en el script<br>');
var a = 6 , b = 2;
c = a*b;
d = a/b;
e = a%b;
f = a+b;
document.write('a= '+ a + '<br>b= ' + b + '<br>c= ' + c);
document.write('<br>d= ' + d +'<br>e= ' + e + '<br>f='+f);
</script>
</BODY></HTML>
Resultado:

1. var es el mtodo que utilizamos para crear variables, en JavaScript la variables toman el
tipo de dato segn el valor con que son asignadas.
Material facilitado por Ing. Gerardo Josu Portillo (gerardo.portillo@uth.hn)

2. En muchos navegadores, el operador de suma es interpretado como la concatenacin de


caracteres como se mostr en el ejemplo anterior.

Ejemplo: Captura de Datos


Escribir el cdigo siguiente:
<script type="text/javascript">
var a,b,s;
a = prompt("ingrese numero a");
b = prompt("ingrese numero b");
s = a + b;
alert(s);
</script>

1. Para capturar datos utilizamos la funcin prompt, esta muestra un mensaje para
solicitar al usuario que ingrese un dato y este se puede almacenar en una variable.
2. La variable s muestra la concatenacin de a y b

Material facilitado por Ing. Gerardo Josu Portillo (gerardo.portillo@uth.hn)

Cmo solucionamos esto?


Para evitar que los resultados de los prompt se concatenen hay que convertir el valor
capturado a un valor numrico:
<script type="text/javascript">
var a,b,s;
a = prompt("ingrese numero a");
b = prompt("ingrese numero b");

s = parseInt(a) + parseInt(b);
alert(s);
</script>
1. Observe que utilizamos la function parseInt, esta funcin convierte a nmero entero
el contenido de una variable.
2. La funcin parseFloat convierte a nmero con valores decimales el contenido de una
variable.

Material facilitado por Ing. Gerardo Josu Portillo (gerardo.portillo@uth.hn)

Ejemplo: Mensaje de Pregunta


Escribir el cdigo siguiente:
<html><body>
<script type="text/javascript">
resp = confirm("Carrera de Programador?");
alert(resp)
</script>
</body></html>

1. Para preguntar al usuario utilizamos la funcin confirm la cual muestra un mensaje para
preguntar algo al usuario, la respuesta que el usuario de ser almacenada en la variable
llamada resp.
2. Posteriormente a la pregunta, se muestra otro mensaje con la funcin alert el cual
muestra lo que el usuario ha respondido (almacenado en la variable resp), dicho valor
ser del tipo booleano por lo tanto si se responde Aceptar entonces se retornar true,
de lo contrario se retornar false:

En el siguiente parcial aprenderemos sobre las estructuras de control, los ciclos, las
funciones y el acceso a datos.

xitos y bendiciones para ustedes futuros ingenieros.

Material facilitado por Ing. Gerardo Josu Portillo (gerardo.portillo@uth.hn)

También podría gustarte