PROGRAMACION EN VBSCRIPT

DISEÑO EN HTML Y PROGRAMACION EN VBSCRIPT PEDRO LOPEZ SALAZAR INSTITUTO TECNOLOGICO SUPERIOR DE ZAPOPAN

ALUMNO: PEDRO LOPEZ SALAZAR

CARRERA: ING EN SISTEMAS COMPUTACIONALES

MATERIA: PROGRAMACION WEB

PROFESOR: NOE HERNANDEZ

PROGRAMACION WEB INCLUYE:

* HTML

*VBSCRIPT

*JAVASCRIPT JAVA 2

*APPLETS

*SERVLETSLIBRO RECOMENDADO: DOMINE JAVASCRIPT

Página de 126

1


EVALUACIONES:

*EXAMEN 20%

*PRACTICAS DE

LABORATORIO 40%

*TAREAS 40%

Página de 126

2


HTML

<HTML>

< HEAD>

<TITLE> </ TITLE>

</HEAD>

<BODY>

Estructura básica ------------------------------

En html --------------------------------

Página de 126

3


-------------------------------

</BODY>

</BODY>

EL HTML ESTATICO

SE LLAMA HTML ESTATICO POR QUE NO SE MODIFICA LA PAGINA WEB NO SI ANTES MODIFICAR EL CODIFUENTE DE LA PAGINA , Y ACTUALIZARLO..

EL HTML DINAMICO

SE LLAMA HTML DINAMICO POR QUE CAMBIA EN TODO MOMENTO Y ADEMAS OCUPA UN LENGUAJE DE PROGRAMACION AVANZADO..

Página de 126

4


PROGRAMA 1

Página de 126

5


Página de 126

6


Página de 126

7


Página de 126

8


PROGRAMA 2

Página de 126

9


Página de 126

10


Página de 126

11


Pestaña <H1> </H1>

LA PESTAÑA <H1> INDICA EL TAMAÑO DE LA LETRA MAS GRANDE Y MIENTRAS AUMENTE EL VALOR DEL NUMERO SERA MAS PEQUEÑA LA LETRA.

<h1> ITSZapopan </h1>

<h2>Programacion web </h2>

<h3>Pedro Lopez Salazar </h3>

<h3> 26 de agosto del 2009 </h4>

INDICA EL TAMAÑO DE LA LETRA

<font font size ="2"> Hola maquina </font>

Página de 126

12


ListasLas listas se dividen en 2 categorias en numeradas y no numeradas.

Ejemplo:

<html>

<head>

<title>numeradas</title>

</head>

<body>

<ol>

<li>fisica

<li>quimica

<li>web

</ol>

</body>

</html>

Página de 126

13


Página de 126

14


Página de 126

15


Página de 126

16


LA PESTAÑA PARA ENUMERAR <OL> <li></OL>

SINTAXIS:

<OL>

<LI>UNO

<LI>DOS

</OL>

<OL>

<LI> 1ER NOMBRE DE LO QUE QUIERES QUE APAREZCA ENUMERADA </ OL> SIRVE PARA ENUMERAR

<LI> 2DO NOMBRE DE LO QUE QUIERES QUE APAREZCA ENUMERADA </ OL> SIRVE PARA ENUMERAR

</OL>

Página de 126

17


LA PESTAÑA PARA NO ENUMERAR <UL>

SINTAXIS:

<UL>

<LI>UNO

<LI>DOS

</UL>

<UL>

<LI> 1ER NOMBRE DE LO QUE QUIERES QUE APAREZCA ENUMERADA </ OL> SIRVE PARA ENUMERAR

<LI> 2DO NOMBRE DE LO QUE QUIERES QUE APAREZCA ENUMERADA </ OL> SIRVE PARA ENUMERAR

</UL>

Página de 126

18


PROGRAMA 4

Página de 126

19


Página de 126

20


Página de 126

21


PARA MODIFICAR LOS CAMBIOS TIENES QUE SEGUIR ESTOS PASOS PARA MODIFICAR EL CODIGO :

Página de 126

22


Página de 126

23


Página de 126

24


TABLAS

.

Página de 126

25


Página de 126

26


Página de 126

27


Página de 126

28


ETIQUETA <TD>

ESTA ETIQUETA SIRVE PARA GENERAR CELDAS DE CABECERA CON LETRA NORMAL.

Página de 126

29


ETIQUETA <TH>

ESTA ETIQUETA SIRVE PARA GENERAR CELDAS O CAMPOS O TUPLAS DE CABECERA NEGRITA.

.

Página de 126

30


Página de 126

31


ETIQUETA < TR> </TR>

ESTA ETIQUETA (TR)GENERA FILAS DENTRO DE ELLA ESTA LAS ETIQUETAS TD (CABECERA NEGRITA) Y TD (CABECERA NORMAL), COMO POR EJEMPLO:

Página de 126

32


Página de 126

33


EXPLICACION DEL CODIGO:

Página de 126

34


<html>

<head>

<title> GENERANDO FILAS </title>

</head>

Con <HTML> es la cabecera del programa o directiva a si como en c++ que lleva en la parte de arriba las librerias que son : include<iostream.h>.

<head> es la cabecera de la pagina que estés desarrollando y aparece en la parte de arriba.

<title> es el nombre del titulo de tu pagina web

Nota : para cerrar las etiquetas unicamente se cierra con < / nombre de la etiqueta a cerrar>

Ejeplo: <title> escribe el titulo del programa </title >

<body>

La etiqueta body es el cuerpo de la pagina web y alli va todo lo que quieras agregar como por ejemplo crear tables , botones , graficos, animaciones , imagines etc.

<table border = "2">

Esta etiqueta sirve para darle el borde de la tabla entre mayor sea el numero mayor sera el borde

Página de 126

35


<TR>

<TH>NOMBRE

<TD>CALIFICACION 1

<TH>CALIFICACION 2

</TR>

Con la etiqueta <tr> vamos a crear filas dentro de la tabla y dentro de ella decirle si las cabeceras que contendran seran cabeceras negritas <tdo> o normales<th> y al final cerrarlo con la etiqueta < /tr > con eso terminamos y asi delimitamos la fila de las tablas de igual forma se realizan las siguientes filas.

<TR>

<TD>JUAN

<TD>100

<TD>90

</TR>

<TR>

<TD>PEDRO

<TD>100

<TD>100

Página de 126

36


</TR>

<TR>

<TD>MANLIO

<TD>90

<TD>99

</TR>

<TR>

<TD>MARIO

<TD>100

<TD>80

</TR>

<TR>

<TD>DALIA

<TD>80

<TD>100

</TR>

Página de 126

37


<TR>

<TD>DANIELA

<TD>85

<TD>95

</TR>

Para finalizar todo únicamente cerramos las pestañas que en su momento se abrieron recuerda que debes de cerrarlo de adentro para fuera.

</table>

</body>

</html>

Ejemplo:

<html>

<head>cabecera de la pagina web

<title> titulo de la pagina web <title>

</head>

<body>

Datos en el cuerpo de la pagina

</body>

Página de 126

38


</html>

TAREA 1.- CREAR 6 FILAS Y 4 COLUMNAS, CREAR 4 ENCABEZADOS NORMALES Y NEGRITA Y DENTRO DE CADA CELDA ESCRIBIR LOS NUMEROS ROMANOS, LETRAS MAYUSCULAS, LETRAS MINUSCULAS, NUMEROS. Y AGREGAR LISTAS ORDENADAS.

EN ESTE CODIGO PONGO EL TITULO DE LAPAGINA , DECLARO EL BORDE DE MI TABLA ,EMPIEZO A CREAR MISCABEZALES NEGRITAS Y NORMALES.

<html>

<head>

<title> PRIMERA PRACTICA DE PROGAMACION WEB. </title>

</head>

<BODY>

<TABLE BORDER="1">

<TR>

<TD>Numeros Romanos

<TH>Letras Mayusculas

<TD>Letras Minusculas

<TH>Numeros

</TR>

----------------------------------------------------------------------------------------------------------------------------------

Página de 126

39


a. Variantes de las listas ordenadasnumerada normal, como hemos visto

<ol><li>un ordenador pentium 1000</li> <li>tarifa plana ¡ya!</li> <li>vacaciones en el caribe</li> <li>vacaciones para nuestro jefe </li></ol>

lista ordenada con letras ...:

<ol type="A"><li>Un ordenador Pentium 1000 </li><li>Tarifa plana ¡ya! </li><li>Vacaciones en el Caribe</li> <li>Vacaciones para nuestro Jefe </li></ol>

lista con formato A, B, C ...

A. Un ordenador Pentium 1000 B. Tarifa plana ¡ya! C. Vacaciones en el Caribe D. Vacaciones para nuestro Jefe

El mismo tipo de orden, en minúsculas:

<ol type="a"><li>Un ordenador Pentium 1000 </li><li>Tarifa plana ¡ya! </li><li>Vacaciones en el Caribe</li> <li>Vacaciones para nuestro Jefe </li></ol>

minúsculas

a. Un ordenador Pentium 1000 b. Tarifa plana ¡ya! c. Vacaciones en el Caribe d. Vacaciones para nuestro Jefe

Ordenada con numeros romanos:

<ol type="I"><li>Un ordenador Pentium 1000 </li><li>Tarifa plana ¡ya! </li><li>Vacaciones en el Caribe</li> <li>Vacaciones para nuestro Jefe </li></ol>

Página de 126

40


numeros romanos

I. Un ordenador Pentium 1000 II. Tarifa plana ¡ya! III. Vacaciones en el Caribe IV. Vacaciones para nuestro Jefe

numerada con numeros romanos en minúscula:

<ol type="i"><li>Un ordenador Pentium 1000 </li><li>Tarifa plana ¡ya! </li><li>Vacaciones en el Caribe</li> <li>Vacaciones para nuestro Jefe </li></ol>

numeros romanos en minúscula

i. Un ordenador Pentium 1000 ii. Tarifa plana ¡ya! iii.Vacaciones en el Caribe iv. Vacaciones para nuestro Jefe

-----------------------------------------------------------------------------------------------------------------------------

&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&

Continuación:

Página de 126

41


En esta parte creare la siguiente fila con <tr> y escribiré <td> para crear celda de cabecera normal. Y para enumerarlos ocupamos escribir <OL TYPE ="I"> para que escriba en forma consecutivo. Y como vamos a listarlo ocupamos la etiqueta <LI> y para finalizar toda la fila lo cerramos con </TR>

<TR>

<TD>

<OL TYPE ="I">

<LI> ONE

<TD>

<OL TYPE ="A">

<LI> AARON

<TD>

<OL TYPE ="a">

<LI> avast

<TD>

<OL TYPE ="1">

<LI> uno

</TR>

&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&

Página de 126

42


-------------------------------------------------------------------------------------------------------------------------------

b. enredando con el orden de la listacon el atributo start= añadido a una etiqueta <ol>, la lista comienza donde indiquemos. Y con el atributo value= añadido a una etiqueta <li>, podemos forzar la numeracion de esa etiqueta y las siguientes:

<ol start="7"><li>Un ordenador Pentium 1000</li><li>Tarifa plana ¡ya!</li><li value="10">Vacaciones en el Caribe</li><li>Vacaciones para nuestro Jefe</li></ol>

comienza en 7, salta a 10

7. Un ordenador Pentium 1000 8. Tarifa plana ¡ya! 10. Vacaciones en el Caribe 11. Vacaciones para nuestro Jefe

-----------------------------------------------------------------------------------------------------------------------------

&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&

CONTINUACION:

Página de 126

43


ETIQUETA START

con el atributo start= añadido a una etiqueta <ol>, la lista comienza donde indiquemos.

<TR>

<TD>

<OL TYPE ="I" START ="2">

<LI> D

<TD>

<OL TYPE ="A" START ="2">

<LI> D

<TD>

<OL TYPE ="a"START ="2">

<LI> D

<TD>

<OL TYPE ="1"START ="2">

<LI> D

</TR>

Página de 126

44


<TR>

<TD>


<LI> D

<TD>


<LI> D

<TD>


<LI> D

<TD>


<LI> D

</TR>

<TR>

<TD>


Página de 126

45


<LI> D

<TD>


<LI> D

<TD>


<LI> D

<TD>


<LI> D

</TR>

</BODY>

</html>

Página de 126

46


EJERCICIO

Página de 126

47


uno dos

tres cuatro cinco

seis

Atributos de celdas

ROWSPAN

INDICA EL NUMERO DE RENGLONES QUE QUEREMOS OCUPAR.

COLSPAN

INDICA EL NUMERO DE COLUMNAS QUE DESEAMOS OCUPAR

NOTA : INDICAN CUANTAS FILAS O COLUMNAS QUIERES INVOLUCRAR.

PRACTICA:

Página de 126

48


<html>

<head>

<title>segunda practica de programacion web </title>

</head>

<body>

<table border ="27" >

<tr>

<td colspan ="2">uno

<td>dos

</tr>

<tr>

Página de 126

49


<td rowspan ="2" >tres

<td rowspan ="2" >cuatro

<td>cinco

</tr>

<tr>

<td>seis

</tr>

</table>

</body>

</html>

FORMULARIOATRIBUTOS:

Página de 126

50


SON LAS CARACTERISTICAS QUE VAMOS A INVOLUCRAR.

SCRIPT:

ES UN PROGRAMA ESCRITO EN LENGUAJE DE PROGRAMACION Y SE INCRUSTA DENTRO DE HTML.

FORM

SON OBJETOS INDEPENDIENTES QUE SE VAN A CREAR Y QUE SE INCRUSTAN DENTRO DE LA FORMA.

Para tomar lo que contiene:

NombreFormano.nombreObjeto.value

PARA COMBINAR CODIGO DE HTML EN VBSCRIPT ES:

Document.write (“<br>”)

Página de 126

51


Sirve para dar un salto de línea.

<FORM ATRIBUTO X …….>

<FORM>

----------------------

----------------------

----------------------

</FORM>

ATRIBUTOS DE FORM

TYPE: DISTINGUE EL TIPO DE ENTRADA DE LOS DATOS

NAME : NOMBRE A LA FORMA

ACTION: EJECUTAR O LLAMAR A UNA APLICACIÓN

Página de 126

52


METODO: ”PAST”

ACCESA A LA BASE DE DATOS

METODO: ”GET”

UTILIZAS ESTE METODO CUANDO QUIERES QUE LOS VALORES QUE SE VAYAN A OTRA PAGINA PARA ELLA UTILIZAS EL METODO GET.

<FORM NAME =”FORMA1”.ACTION = “ARCHIVO.ASP”>

----------------

----------------

---------------

</FORM>

PRACTICA:

Página de 126

53


<html>

<head><H4><TH>FORMULARIO PROGRAMACIO WEB<BR>

PEDRO LOPEZ SALAZAR

<title>PRACTICA A ENTREGAR PEDRO LOPEZ SALZAR</title>

</head>

<BODY>

<form name ="forma1">

<table border ="25">

Página de 126

54


<TR>

<TD> NOMBRE

<TD colspan ="2"> <input type ="text" name ="nom">

</TR>

<TR>

<TD> DOMICILIO

<td colspan ="2"> <input type ="text" name ="dom">

</TR>

<TR>

<TD> TELEFONO

<TD colspan ="2"> <input type ="text" name ="tel">

</TR>

<TR>

<TD COLSPAN ="3">SEXO

</TR>

<TR>

<td colspan ="2"> <input type= "radio" name ="sexo">

<TD>MASCULINO

Página de 126

55


</TR>

<TR>


<TD>FEMENINO

</tr>

<TR>

<TD COLSPAN ="3">COLOR

</TR>

<tr>

<td colspan ="2"> <input type= "checkbox" name ="color">

<TD>ROJO

</TR>

<TR>

<TD colspan ="2"> <input type= "checkbox" name ="color">

<TD>AZUL

</TR>

<TR>

<TD colspan ="2"> <input type= "checkbox" name ="color">

<TD>VERDE

</TR>

<TR>

<TD COLSPAN ="3"><input type ="button" value ="enviar">

Página de 126

56


</TR>

</table>

</FORM>

</BODY>

</HTML>

EJEMPLOS PARA CREAR UNA CAJAS DE TEXTO Y UN BOTON

Página de 126

57


<html>

<head>

<title>formulario1</title>

</head>

<body>


Nombre<input type ="text" name ="nom"> <br>

Domicilio<input type ="text" name ="dom"> <br>

Telefono<input type ="text" name ="tel"> <br>

<input type ="button" value ="enviar">

</form>

</body>

</html>

Página de 126

58


<html>

<head>

<title>recamara de una casa </title>

</head>

<body>

<table border ="2" >

<tr>

<td COLSPAN ="3">SEXO

</tr>

<tr>


<TD>MASCULINO

</TR>

Página de 126

59


<TR>


<TD>FEMENINO

</tr>

</table>

</body>

</html>

ETIQUETA <BR>

Página de 126

60


LA ETIQUETA <BR> SIRVE PARA SALTO DE LINEA.

<html>

<head>

<title>formulario2</title>

</head>

<body>


Nombre<input type ="text" name ="nom"> <br>

Domicilio<input type ="text" name ="dom"> <br>

Telefono<input type ="text" name ="tel"> <br><br>

sexo <br>

<input type= "radio" name ="sexo">masculino <br>

<input type= "radio" name ="sexo">femenino<br><br>

color <br>

<input type= "checkbox" name ="color">rojo <br>

<input type= "checkbox" name ="color">azul <br>

<input type= "checkbox" name ="color">verde <br>

<input type ="button" value ="enviar">

</FORM>

Página de 126

61


</body>

</html>

INPUT(ENTRADA BASICA DE DATOS)PARA DEFINIR LOS DISTINTOS TIPOS DE CAMPOS BASICOS DE ENTRADA UTILIZAREMOS LA ETIQUETA INPUT.

<html>

<head>

<title>recamara de una casa </title>

</head>

<body>

<table border ="3">

Página de 126

62


<tr>

<td colspan ="2">uno

<td> dos

</tr>

<tr>

<td rowspan ="2" > tres

<td rowspan ="2" > cuatro

<td> cinco

</tr>

<tr>

<td> seis

</tr>

</table>

</body>

</html>

Página de 126

63


VBSCRIPTScript: es un programa escrito en lenguaje de programación y se incrusta dentro de html.

1) javaScript

2) vbscript

Sintaxis:

<html>

<head>

<title> </title>

</head>

<body>

Página de 126

64


<script> language=”vbscript”>

--------------------------------

--------------------------------

--------------------------------

</script>

</body>

</html>

Nota: <script> language=”vbscript”>

Con este código te indica con que tipo de código de programación vas a realizar tu script ya sea en javascript o vbscript.

Estos tipos de páginas son dinámicas por que van cambiando de acuerdo al dato que se les ponga.

CARACTERÍSTICAS DE VBSCRIPT

Página de 126

65


-no distingue mayúsculas ni minúsculas

-no se declaran variables

-trabaja del lado del cliente (es decir no ocupa compilador).

-código por línea

1er ejemplo en vbscript

<html>

<head>

<title>HOLA MUNDO EN SCRIPT</title>

</head>

<BODY>

<SCRIPT language ="VBSCRIPT">

CADENA="hola mundo"

DOCUMENT.WRITE(CADENA)

</SCRIPT>

</BODY>

</HTML>

Explicación del codigo:

<SCRIPT language ="VBSCRIPT">

Página de 126

66


Aquí abres la pestaña script y te indicas que vas a programarlo con el lenguaje de vbscript

CADENA="hola mundo"

Aquí estas declarando una cadena en la cual guarda la información llamada” hola mundo”

DOCUMENT.WRITE(CADENA)

Aquí vamos a imprimir el documento escrito y lo mostraremos en pantalla.

Página de 126

67


Ejercicio 2:

<html>

<head>

<title>HOLA MUNDO EN SCRIPT</title>

</head>

<BODY>

<form name = "forma1">

numero1<input type ="text" name ="uno">

numero2<input type ="text" name ="dos">

<input type ="button" name="resultado" value="presionar">

<script for="resultado" event="onclick" language ="vbscript">

numero1=forma1.uno.value

numero2=forma1.dos.value

resultado=numero1*numero2

document.write("TU RESULTADO ES :")

document.write(resultado)

</SCRIPT>

</form>

Página de 126

68


</BODY>

</HTML>

Explicación del codigo:


Se escribe <form name=”forma1”> es mi area de trabajo donde voy a creae mis objetos ya sean botones, cuadros de textos ,checkbox etc.

numero1<input type ="text" name ="uno">

numero2<input type ="text" name ="dos">

aqui escribimos el nombre dela pestaña y en input es para decirle al programa que tipo de entrada va hacer en este caso sera un cuadro de texto en ingles es textfile y en nombre sera el nombre de la variable que se encargara de recoger(almacenar) los valores dentro de estas variable .

<input type ="button" name="resultado" value="presionar">

Aqui vamos a crear un boton con la variable resultado y el nombre se llama presionar

<script for="resultado" event="onclick" language ="vbscript">

Para la variable resultado el evento que se realizara sera un clic y el lenguaje que utilizaremmos sera el vbscript


Página de 126

69



resultado=numero1*numero2

aquí los valores que insertemos en el cuadro de texto se guardaran en numero1 y numero2

y la multiplicación de estas 2 variables se guardaran en resultado

document.write("TU RESULTADO ES :")

Aquí le vamos a decir que nosmuestre este mensaje.

document.write(resultado)

Aquí le vamos a decir que nos muestre el resultado de la multiplicacion de los dos numeros.

Página de 126

70


Ejercicio 3

Realizar una calculadora en vbscript

Página de 126

71


<html>

<head>

<title>calculadora en vbscript</title>

</head>

<BODY>

<font color="green"><h4>calculadora en vbscript Pedro Lopez Salazar</h4></font>


<!variables de entrada declarados>

numero1<input type ="text" name ="uno"><br>

numero2<input type ="text" name ="dos"><br>

<input type ="button" name="resultado1" value=" * ">

<input type ="button" name="resultado2" value=" / ">

Página de 126

72


<input type ="button" name="resultado3" value=" + ">

<input type ="button" name="resultado4" value=" - ">

<script for="resultado1" language ="vbscript" event="onclick" >



resultado1=numero1*numero2

document.write("=")

document.write(resultado1)

</script>




resultado2=numero1/numero2

document.write("=")


</script>

Página de 126

73



numero1=cint(forma1.uno.value)

numero2=cint(forma1.dos.value)

resultado3= numero1+ numero2

document.write("=")


</script>




resultado4=numero1-numero2

document.write("=")


</script>

</form>

</BODY>

</HTML>

Página de 126

74


Calculadora insertándole a una tabla y ponerle música y una imagen de fondo

<html>

<head><H4><TH><MARQUEE> CALCULADORA EN VBSCRIPT PROGRAMACIO WEB <BR>

PEDRO LOPEZ SALAZAR</MARQUEE>

<title>PRACTICA A ENTREGAR PEDRO LOPEZ SALZAR</title>

</head>

<body background="ntimage.GIF">

<form name="forma1">


Página de 126

75


<TR>

<TD BGCOLOR="GREEN">NUMERO 1:

<TD BGCOLOR="GREEN"> <input type ="text" name ="uno">

</TR>

<TR>

<TD BGCOLOR="GREEN">NUMERO 2:

<td BGCOLOR="GREEN"> <input type ="text" name ="dos">

</TR>

<tr> <td BGCOLOR="#A2FF25"><center><input type ="button" name="resultado1" value=" MULTIPLICACION ">

<td BGCOLOR="#A2FF25"><input type ="button" name="resultado2" value=" DIVICION "></center></tr>

<tr><td BGCOLOR="#A2FF25"><center><input type ="button" name="resultado3" value=" SUMA ">

<td BGCOLOR="#A2FF25"><input type ="button" name="resultado4" value=" RESTA "></center>

</tr>

<TR>

<br> <td colspan="2" BGCOLOR="#A2FF25" ><CENTER> <input type="button" name="calcular" value="CALCULAR CUENTA "></CENTER>

</TR>

Página de 126

76


<BGSOUND SRC ="ETERNO AMOR DE DIOS.MP3" MOUSEOVER CONTROLS>

</table>

</form>




resultado1=numero1*numero2

document.write("=")


</script>




resultado2=numero1/numero2

document.write("=")


</script>

Página de 126

77



numero1=cint(forma1.uno.value)

numero2=cint(forma1.dos.value)

resultado3= numero1+ numero2

document.write("=")


</script>




resultado4=numero1-numero2

document.write("=")


</script>

</form>

</BODY>

</HTML>

Página de 126

78


ESTRUCTURAPágina de 126

79


DE

CONTROL

2)SELECTIVASSINTAXIS:

1)

IF( CONDICION )THEN

----------------------------------

------SENTENCIAS----------

-----------------------------------

END IF

Página de 126

80


2)

IF( CONDICION )THEN

----------------------------------

------SENTENCIAS----------

-----------------------------------

ELSE IF

----------------------------------

------SENTENCIAS----------

-----------------------------------

END IF

2)

IF( CONDICION )THEN

----------------------------------

------SENTENCIAS----------

-----------------------------------

END IF

IF( CONDICION )THEN

----------------------------------

Página de 126

81


------SENTENCIAS----------

-----------------------------------

END IF

EJERCICIO:

Página de 126

82


Codigo fuente :

Página de 126

83


<HTML><HEAD><TITLE>PRACTICA A ENTREGAR PEDRO LOPEZ SALZAR</TITLE>

<META http-equiv=Content-Type content="text/html; charset=windows-1252"><TH>

<META content="MSHTML 6.00.2900.2180" name=GENERATOR></HEAD>

<BODY background="PRACTICA A ENTREGAR PEDRO LOPEZ SALZAR_archivos/ntimage.GIF">

<H4>

<MARQUEE>DIAS TRABAJADOS EN PROGRAMACIO WEB <BR>PEDRO LOPEZ SALAZAR</MARQUEE>

<P>

<P>

<P>LOS EMPLEADOS DE UNA FABRICA TRABAJAN 2 TURNOS DIURNO Y NOCTURNO<BR>SE DESEA

CALCULAR EL JORNAL DIARIO DE ACUERDO CON LOS SIGUIENTES PUNTOS.

<OL>

<LI>LAS TARIFAS DE LAS HORAS DIURNAS ES DE $500

<LI>LAS TARIFAS DE LAS HORAS NOCTURNAS ES DE $800

<LI>CASO DE SER DOMINGO LA TARIFA SE INCREMENTA A $200 PARA EL TURNO DE LA

NOCHE<BR>Y 300 PARA EL TURNO DE LA NOCHE. </LI></OL><BR>

<P>

<P>

<FORM name=forma1>

<TABLE border=15>

<BODY>

<TR>

Página de 126

84


<TD>NOMBRE

<TD colSpan=2><INPUT name="nom"> </TD>

<TR>

<TR>

<TD>HORAS

<TD colSpan=2><INPUT name="varhour"> </TD>

<TR>

<TD>DIA TRABAJADO

<TD colSpan=2><INPUT name="vardtt"> </TD>

<TR>

<TD>TURNO

<TD colSpan=2><INPUT name="vartur"> </TD>

<TR>

<TD colSpan=3>

<CENTER><INPUT type=button value=consultar name=calcular>

</CENTER></TD><BGSOUND src="" CONTROLS MOUSEOVER></TR></TBODY></TABLE></FORM><!-esta es la etiqueta para agregar comentario en los script y html-><!-el lenguaje a utilizar es vbscript , al presionar el boton consultar que tiene como variable calcular se ejecutara tal evento->

<SCRIPT language=vbscript event=onclick for=calcular>

emp=forma1.nom.value

jn=cint(forma1.varhour.value) 

Página de 126

85


dt=forma1.vardtt.value 

tr=forma1.vartur.value 

if( dt<>"domingo" )then

if(tr="dia")then

jn=500*jn

document.write("A pagar al Sr. "&emp&" la cantidad de $ "&jn)

else

jn=800*jn

document.write("A pagar al Sr. "&emp&" la cantidad de $ "&jn&" por haber venido atrabajar de noche")

end if

else

if(tr="dia")then

jn=500+200*jn

document.write("A pagar al Sr. "&emp&" la cantidad de $ "&jn)

else

jn=800+300*jn

document.write("A pagar al Sr. "&emp&" la cantidad de $ "&jn&" por haber venido a realizar horas extras")

end if

Página de 126

86


end if

</SCRIPT>

</P></H4></BODY></HTML>

Ejercicio:

Página de 126

87


Codigo fuente :

Página de 126

88


<html>

<head>

<title>MUESTRA EL MAXIMO Y MINIMO DE 3 NUMEROS EN VBSCRIPT (PEDRO LOPEZ SALAZAR)</title>

</head>

<body>



















<H1> MUESTRA EL MAYOR Y EL MENOR DE 3 VALORES


Página de 126

89



<TR>

<TD>VALOR1

<TD colspan ="2" > <input type ="text" name ="caja1">

</TR>

<TR>

<TD>VALOR2

<td colspan ="2"> <input type ="text" name ="caja2">

</TR>

<TR>

<TD>VALOR3

<TD colspan ="2"> <input type ="text" name ="caja3">

</TR>

<TR>

<td COLSPAN ="3"><CENTER> <input type="button" name="calc" value="consultar"></CENTER>

</TR>

<BGSOUND SRC ="UNIVER.MP3" MOUSEOVER CONTROLS>

</table>

</form>

<script language="vbscript" for="calc" event="onclick">

Página de 126

90


a=cint(forma1.caja1.value)

b=cint(forma1.caja2.value)

c=cint(forma1.caja3.value)

IF( a>b ) AND ( a>c )THEN

document.write("EL MAYOR ES : ")

document.write( a )

END IF

IF(a=b) and (a=c)THEN

document.write("EL MAYOR ES : "&a)

document.write( "<br>")

END IF

IF(a<b) AND (a<c)THEN

document.write("<br>")

document.write("EL MENOR ES: ")

document.write(a)

END IF

IF( b>a ) AND ( b>c)THEN


document.write(b)

END IF

Página de 126

91


IF(b<a) AND (b<c)THEN



document.write(b)

END IF

IF(c>a) AND (c>b)THEN


document.write(c)

END IF

IF(c<a) AND (c<b)THEN



document.write(c)

END IF

</script>

</table>

</form>

</body>

</html>

Página de 126

92


CICLOSPágina de 126

93


O

BUCLES

EN

VBSCRIPT

REPETICION:

El for se utiliza cuando sabemos cuantas iteraciones tendremos en nuestro programa.

for

Sintaxis:

for variable=1 to 10

Página de 126

94


----------------------------

----------------------------

-----------------------------

Next

step 2 cuenta de 2 en 2

step3 cuenta de 3 en 3

Ejemplo: imprime 10 veces la palabra Hola mundo

Página de 126

95


<html>

<head>

<title>FOR IMPRIME 5 VECES LA PALABRA HOLA MUNDO </title>

</head>

<body>

<form>

<input type="button" name="calcular" value="CICLO FOR">

</form>

<script language="vbscript" for="calcular" event="onclick">

for n=1 to 6

document.write(""&n&".-hola mundo")


next

Página de 126

96


</script>

</body>

</html>

REPETICION:

*Se utiliza el while cuando no sabeos cuantas iteraciones Habrá en nuestro ciclo.

while

Sintaxis:

while (condicion)

----------------------------

----------------------------

wend

Ejemplo: imprime 10 veces la palabra Hola mundo

Página de 126

97


Codigo fuente:

<html>

<head>

<title>CICLO WHILE IMPRIME 20 VECES LA PALABRA HOLA MUNDO </title>

</head>

<body>

<form>

<input type="button" name="calcular" value="CICLO WHILE">

</form>

<script language="vbscript" for="calcular" event="onclick">

letrero=1

Página de 126

98


while(letrero<=10)

document.write(""&letrero&".-hola mundo")


letrero= letrero+1

wend

</script>

</body>

</html>

FACTORIAL DE N NÚMEROS

Página de 126

99


<html>

<head><H4><TH><MARQUEE> PROGRAMACIO WEB <BR>

PEDRO LOPEZ SALAZAR</MARQUEE>

<TITLE> FACTORIAL DE UN NUMERO CON CICLO FOR1 (PEDRO LOPEZ SALAZAR)</TITLE>

</head>

<body>


Página de 126

100



<TR>

<TD BGCOLOR="#A2FF25">FACTORIAL:

<TD BGCOLOR="#A2FF25"><input type ="text" name ="num">

</TR>

<TR>

<br> <td colspan="2" BGCOLOR="#A2FF25" ><CENTER> <input type="button" name="calc" value="consultar"></CENTER>

</TR>

</table>

</form>


PEDRO1=forma1.num.value

factorial_cero=1

document.write("FACTORIAL [0] = "&factorial_cero)


factorial=1

Página de 126

101


for contador=1 to PEDRO1

factorial= factorial*contador

document.write("FACTORIAL ["&contador&"] = "&factorial)


next

</script>

</form>

</BODY>

</HTML>

EJERCICIO: NUMERO PERFECTO

Página de 126

102


Numeros perfectos:

6 , 28 ,496

Regla:

*Si el residuo de la división es igual a cero se suma de lo contrario no.

* no se puede dividir el mismo numero por si mismo.

*la suma de sus divisores deben de ser igual al numero a buscar siempre y cuando sus residuos sean igual a cero.

*captura un numero: 6

1/6 residuo =0

2/6 residuo=0

3/6 residuo =0

4/6 residuo=1.5

5/6 residuo =1.2

6/6 no se puede dividir por si mismo

Página de 126

103


<html>

<head><H3><TH><MARQUEE>--------------------------------------NUMEROS PERFECTOS DESPLEGABLES-------

-----------------------------------------------------NUMEROS PERFECTOS DESPLEGABLES-------------------

-------------------NUMEROS PERFECTOS DESPLEGABLES--------------------------------</MARQUEE><P>

<FONT COLOR="BLUE"> PEDRO LOPEZ SALAZAR</FONT>

<title>NUMEROS PERFECTOS PEDRO LOPEZ SALZAR</title>

</head>

<body>



<TR>

<TD BGCOLOR="#A2FF25">NUMERO:

<TD> <input type="text" name="pedro" >

</TR>

<TR>

<br> <td colspan="2" BGCOLOR="#A2FF25" ><input type="button" name="calc" value=" CONSULTAR " >

</TR>

Página de 126

104


</table>

</form>


TOPE=cint(forma1.pedro.value)

NUMERO=1

while(NUMERO<TOPE)

acumulador=0

i=1

while(i<numero)

IF(NUMERO mod i=0 )THEN

acumulador=acumulador+i

END IF

i=i+1

WEND

Página de 126

105


IF(acumulador=NUMERO)THEN

document.write(" El NUMERO : "&NUMERO&" ---------------ES PERFECTO")


ELSE

document.write(" el numero : "&NUMERO&" -------------------no es perfecto")


END IF

NUMERO=NUMERO+1

WEND

</script>

</BODY>

</HTML>

Página de 126

106


TABLAS DE MULTIPLICAR1

<html>

<head>

<title>TABLA SERIE</title>

</head>

<body>


TABLA DE MULTIPLICACION <input type="button"name="calcular" value="resolver"><br>

</form>

<script language="vbscript" for= "calcular" event="onclick">

Página de 126

107


for fila=1 to 10

for columna=1 to 10

document.write(" "&fila * columna )

next

document.write("<BR>")

next

</script>

</body>

</html>

TABLAS DE MULTIPLICAR 2

Página de 126

108


<html>

<head>

<H3><TH><MARQUEE>--------------SERIE DE UNA MULTIPLICACION CON TABLA----------------------</MARQUEE>

UNIVERSIDAD:INSTITUTO TECNOLOGICO SUPERIOR DE ZAPOPAN<BR>

CARRERA :ING EN SISTEMAS<BR>

MATERIA : PROGRAMACION WEB<BR>

</FONT>

<title>TABLA DE MULTIPLICAR</title>

</head>

<body>



<TR>

<TH BGCOLOR="#A2FF25">NUMERO:

Página de 126

109


</TR>

<TR>

<br> <td colspan="2" BGCOLOR="#A2FF25" ><input type="button" name="calcular" value=" CREAR TABLA " >

</TR>

</table>

</form>


document.write("<TABLE BORDER=5>")

for fila=1 to 10

document.write("<TR>")

for columna=1 to 10

document.write("<TH>")

document.write(" "&fila * columna )

next


document.write("</TR>")

next

document.write("</TABLE>")

</script>

</body>

</html>

Página de 126

110


Crear una tabla de multiplicar

<html>

<head><H3><TH><MARQUEE>-------------------

-------------------TABLA DE MULTIPLICAR----------------------------TABLA DE MULTIPLICAR-------------------

-------------TABLA DE MULTIPLICAR--------------------------------------TABLA DE MULTIPLICAR---------------

Página de 126

111


-----------------</MARQUEE><P>

<FONT COLOR="BLUE">

ALUMNO :PEDRO LOPEZ SALAZAR<BR>




</FONT>

<title>TABLA DE MULTIPLICAR CON TABLA EN VBSCRIPT</title>

</head>

<body>



<TR>


<TD> <input type="text" name="num" >

</TR>

<TR>

<br> <td colspan="2" BGCOLOR="#A2FF25" ><input type="button" name="calcular" value=" CREAR TABLA " >

</TR>

Página de 126

112


</table>

</form>


NUMER=cint(forma1.num.value)

document.write("<BACKGROUND=GREEN>")

document.write("<MARQUEE>")

document.write("<FONT COLOR=BLUE>")

document.write("---------PEDRO LOPEZ SALAZAR---------INGENIERIA EN SISTEMAS COMPUTACIONALES-----------PROGRAMACION WEB--------------VBSCRIPT-----------------")

document.write("</MARQUEE>")


document.write("<table border=30>")

for F=1 to 10

document.write("<tr>")

resultado=NUMER*F

document.write("<TD> "& NUMER & " x " & F & " <TD> " + " = " & resultado)


document.write("</tr>")

Página de 126

113


next

document.write("</table>")

</script>

</body>

</html>

Página de 126

114


<html>

<head>

<title>TABLAS</title>

</head>

<body>

<FONT COLOR=BLUE>

ALUMNO :PEDRO LOPEZ SALAZAR<BR>




</FONT>

<form name="tablas">

TABLA<input type="text"name="num"><BR>

Página de 126

115


<input type="button"name="calcular"value=" RESOLVER "><br>

</form>


NUMER=cint(tablas.num.value)

for F=1 to 10

resultado=NUMER*F

document.write(NUMER & "x" & F & "=" & resultado & "<br>")

next

</script>

</body>

</html>

Examen de programación Web

Página de 126

116


<html>

<head>

<title>BEBIDAS (PEDRO LOPEZ SALAZAR)</title>

</head>

<body BACKGROUND=BOMBON3.JPG>

Página de 126

117


<center>


<table border ="5">

<tr>

<TD> <FONT COLOR=YELLOW> VINO1</FONT>

<TD colspan ="2"><input type ="text" name ="caja1">

<TD><FONT COLOR=YELLOW> AÑO<input type ="text" name ="anio1"></FONT>

</TR>

<TR>

<TD><FONT COLOR=YELLOW> VINO2</FONT>


<TD ><FONT COLOR=YELLOW> AÑO<input type ="text" name ="anio2"></FONT>

</TR>

<tr>


<TD colspan ="2" > <input type ="text" name ="caja3">


</TR>

<TR>

Página de 126

118





</TR>

<TR>




</TR>

<TR>

<td COLSPAN ="4"><CENTER> <input type="button" name="calc" value=" CONAULTAR A PEDRO LOPEZ "></CENTER>

</TR>

<BGSOUND SRC ="UNIVER.MP3" MOUSEOVER CONTROLS>

</table>

</form>

</center>

<marquee><FONT COLOR=YELLOW>-----------------------PEDRO LOPEZ SALAZAR--------------INSTITUTO TECNOLOGICO SUPERIOR DE ZAPOPAN ---

--------PROGRAMACION WEB WN VBSCRIPT---------ING EN SISTEMAS-----------------------------</FONT></marquee>

Página de 126

119



a1=cint(forma1.caja1.value)

a2=cint(forma1.anio1.value)

b1=cint(forma1.caja2.value)

b2=cint(forma1.anio2.value)

c1=cint(forma1.caja3.value)

c2=cint(forma1.anio3.value)

d1=cint(forma1.caja4.value)

d2=cint(forma1.anio4.value)

e1=cint(forma1.caja5.value)

e2=cint(forma1.anio5.value)

ax1=a1 / a2

ax2=b1 / b2

ax3=c1 / c2

ax4=d1 / d2

Página de 126

120


ax5=e1 / e2

document.write("TOTAL DE VINO1 EN "&ax1&" litros")















</script>

</table>

Página de 126

121


</form>

</body>

</html>

Suma de números de pares sacar el promedio de números impares

Página de 126

122


<html>

<head> <H3><FONT COLOR="#A2FF25">PROGRAMA :suma los numeros pares y sacar el promedio de los numeros

<CENTER>impares con ciclo while</FONT></CENTER></H3>

<TITLE> PERO LOPES SALAZAR</TITLE>

</head>

<body BACKGROUND=3067.JPG>

Página de 126

123




<TR>


<TD> <input type="text" name="num" >

</TR>

<TR>

<br> <td colspan="2" BGCOLOR="#A2FF25" ><input type="button" name="calc" value=" CONSULTAR " >

</TR>

</table>

</form>


TOPE=cint(forma1.num.value)


sumaimpar=0

impares=0

sumapares=0

Página de 126

124


num=1

while(num<=TOPE)

if (num mod 2=0)then

sumapares=sumapares+num

document.write("<FONT COLOR=BLUE>")

document.write("El NUMERO [ "&num&" ] = PAR")

document.write("</FONT>")


else

sumaimpar=sumaimpar+num

impares=impares+1

document.write("<FONT COLOR=RED>")

document.write("El NUMERO [ "&num&" ] = IMPAR")

document.write("</FONT>")


end if

num=num+1

wend

promimpares=sumaimpar/impares

Página de 126

125





document.write("<marquee>")

document.write("ALUMNO:PEDRO LOPEZ SALAZAR-------------------------ING EN SISTEMAS COMPUTACIONALES------------------MATERIA:PROGRAMACIO WEB--------------INSTITUTO TECNOLOGICO SUPERIOR DE ZAPOPAN------------------")

document.write("</marquee>")

document.write("SUMA DE LOS NUMEROS PARES ES : ="&sumapares)


document.write("PROMEDIO DE LOS NUMEROS IMPARES : ="&promimpares)


</script>

</BODY>

</HTML>

Página de 126

126

Date post:	13-Jun-2015
Category:	Education
Upload:	guestfccb3f8
View:	3,501 times
Download:	4 times

PROGRAMACION EN VBSCRIPT

Education