Vista previa del material en texto
Desarrollo de Software
7º Semestre
Programa de la asignatura:
Programación web I
Unidad 3. Desarrollo de sitios web
Clave:
15144738
Ciudad de México, agosto del 2023
Universidad Abierta y a Distancia de México
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 2
Índice
Unidad 3. Desarrollo de sitios web ......................................................................................... 3
Presentación de la unidad ....................................................................................................... 3
Logros ................................................................................... ¡Error! Marcador no definido.
Competencia específica .......................................................................................................... 5
3.1. Estructura JavaScript ....................................................................................................... 5
3.1.1. Objetos, funciones y métodos sobre JavaScript ........................................................... 7
3.1.2. Eventos sobre JavaScript ............................................................................................ 11
3.1.3. JavaScript combinado con HTML .............................................................................. 16
3.1.4. JavaScript y PHP ........................................................................................................ 24
3.2. Estructura ASP .............................................................................................................. 33
3.2.1. Contenidos básicos ASP ............................................................................................. 35
3.2.2. Objetos y funciones de ASP ....................................................................................... 37
3.3. Base de datos para Web ................................................................................................. 42
3.3.1. Tipos de base de datos ................................................................................................ 44
3.3.2. Instaladores de servidores web ................................................................................... 47
3.3.3. Conectividad de base de datos con PHP ..................................................................... 48
3.3.4. Inserción, consulta, edición y eliminación de registros .............................................. 49
Cierre de la unidad ................................................................................................................ 50
Para saber más ...................................................................................................................... 51
Fuentes de consulta ............................................................................................................... 52
Videografía: .......................................................................................................................... 53
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 3
Unidad 3. Desarrollo de sitios web
Presentación de la unidad
Es muy importante tener presente que en el proceso de desarrollo de un sitio web se
deben integrar recursos que lo hagan atractivo, y que faciliten la interactividad con los
usuarios que estén navegando en el sitio mediante las páginas web. Es importante que sea
más factible para realizar la administración del sitio y que se consideren las nuevas
tecnologías que permitan integrar los principios de usabilidad en el diseño y desarrollo de
los sitios web, tales como la evidencia, velocidad, retroalimentación, exactitud, etcétera, y
así facilitar el acceso y utilización de los sitios en la vida cotidiana del usuario. Para ello, es
recomendable utilizar el lenguaje de programación JavaScript, que permite integrar más
recursos a las páginas, dependiendo de los requerimientos de los usuarios y de la
organización para la cual se desarrolle el sitio.
Como futuro ingeniero en Desarrollo de Software puedes proponer que tu sitio web tenga
una mejor presentación, añadiendo creatividad con el uso JavaScript, para realizar varias
acciones tales como animaciones, combinación de colores, entre otros.
Para programar en JavaScript debes de contar con conocimientos de HTML, ya que
JavaScript se inserta en código HTML de forma que el código queda reflejado en la propia
página, y no es necesario cargarlo o llamarlo para su utilización. Esto quiere decir que
JavaScript no necesita compilación, tiene la ventaja de que determinadas acciones quedan
en estado de espera hasta que el usuario realiza cierta acción; por ejemplo, pasar el
puntero del ratón sobre una imagen y que cambie a otra. Cabe mencionar que JavaScript
puede trabajar con PHP, con el fin de que se pueda:
• Enviar información de un sitio web a un correo electrónico.
• Generar un documento en PDF.
• Almacenar la información que integre el usuario en los formularios para guardarse
en la base datos.
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 4
Estas acciones se pueden realizar en una sola con la ayuda de JavaScript. También es
importante tener conocimiento de ASP, porque permite hacer una página más interactiva
y funcional. Como ya se ha explicado anteriormente, ASP es una tecnología de Microsoft
por lo que es más exigente para trabajar con ella. Por otro lado, permite obtener de forma
simple y variada información específica a los requerimientos. Ya no es necesario crear
nuevas páginas cada vez que se desee subir nueva información, ni estar remodelando
páginas publicadas, con la finalidad de tenerla al día. En la actualidad, con las páginas web
ASP, se pueden crear plantillas, conectarse a base de datos y mostrar así un contenido
distinto para cada requerimiento o necesidad que solicite el dueño del sitio web.
Otro punto muy importante es saber cómo se crean las bases de datos y se conectan en
las páginas web. En la actualidad, los sitios tienen de más de una base de datos; esto es
porque permiten saber información de los usuarios, realizar trámites más rápidos, hacer
pagos, etcétera. Todo para que sean más fáciles y más factibles para la empresa que tiene
su sitio web.
Algunas marcas que se mencionan en esta unidad son las siguientes:
• JavaScript, marca registrada de Sun Microsystems Inc.
• CuteFTP, aplicación para la transferencia de archivos por FTP, de GlobalSCAPE Inc.
Logros:
Al término de esta unidad lograrás:
• Analizar las aplicaciones web basadas en Javascript para incorporarlas a un
proyecto de sitio web.
• Utilizar instaladores web para realizar la conexión de un sitio web a una base de
datos.
• Integrar funcionalidades de gestión de información usando el editor web.
http://www.alegsa.com.ar/Dic/aplicacion.php
http://www.alegsa.com.ar/Dic/transferencia.php
http://www.alegsa.com.ar/Dic/archivo.php
http://www.alegsa.com.ar/Dic/ftp.php
http://www.alegsa.com.ar/Dic/globalscape.php
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 5
Competencia específica
• Implementar un sitio web en un servidor de prueba para posibilitar la
manipulación de registros mediante la conexión de base de datos.
3.1. Estructura JavaScript
En este tema se expondrá lo referente a la estructura de JavaScript, que es un lenguaje
interpretado y usado para múltiples propósitos, pero sólo considerado como un
complemento en la construcción de sitios web. “Se presenta como un lenguaje de
desarrollo de aplicaciones cliente/servidor a través de Internet […]. Es un lenguaje
compacto, y basado en objetos, diseñado para el desarrollo de aplicaciones cliente-
servidor a través de Internet” (Sánchez, 2001, pp. 9-10).
Como se explicó en la Unidad 1. Fundamentos web, gracias a JavaScript es posible
desarrollar programas que se ejecutendirectamente en el navegador, de manera que
pueda efectuar determinadas operaciones o tomar decisiones sin necesidad de acceder al
servidor. Por ejemplo, al desarrollar un programa que verifique una clave de acceso a una
página web, JavaScript debe comprobar la información dada por el usuario, corroborar
que sea correcta y actuar en consecuencia.
El código de JavaScript va incluido o embebido, como se suele decir, dentro de un
documento HTML. Se recomienda que dicho código vaya insertado en la cabecera del
documento; es decir, entre las etiquetas <head> y </head>. De esta manera, se posibilita
que se cargue el script antes de ser llamado dentro del cuerpo del documento con las
etiquetas <body></body>; si fuera al revés, es muy posible que la llamada se realice a un
elemento que aún no ha sido declarado y no habría nada a qué referirse. La estructura de
JavaScript genérica es la siguiente (Sánchez, 2001, p. 16):
<script
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 6
language=”JavaScript”>
<!—Apertura de etiqueta de
ocultamiento
//Código, funciones, objetos,
etc.
//Cierre de etiqueta de
ocultamiento -->
</script>
Estructura genérica de JavaScript. Fuente: Sánchez, 2001, p. 16.
La etiqueta <script> es el único atributo actualmente fijo sin cambio alguno. Se usa para
indicar el lenguaje de elaboración de JavaScript (Sánchez, 2001).
Los códigos JavaScript se pueden colocar en la cabecera o en el cuerpo del documento,
dependiendo de la lógica de cada programador y de la necesidad que vayan surgiendo en
la construcción de la página web. En los subtemas que conforman este tema, se explicará
con mayor detalle la forma de integrar estos códigos, así como las ubicaciones idóneas
para ellos, dependiendo del objetivo con el que se utilice en la elaboración de las páginas
de un sitio web.
En el primer subtema, 3.1.1. Objetos, funciones y métodos sobre JavaScript, se explicará
en qué consisten así como sus funcionalidades, lo que permite mayor interactividad y se
utiliza en la programación orientada a objetos para la construcción del sitio web, así como
la facilidad con la que se logra mediante los objetos, funciones y métodos de JavaScript.
(Sánchez, 2001).
En el segundo subtema, 3.1.2. Eventos sobre JavaScript, se explicará la forma en que
JavaScript trabaja con eventos gracias a los manipuladores o manejadores de eventos que
incorpora este programa; por ejemplo, si el usuario da clic sobre un botón en una página
web, se produce un evento y el correspondiente manejador del evento clic, en este caso
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 7
OnClick, registrará la acción y realizará las tareas que se le hayan asignado en tal caso
(Brito, 2009).
En el tercer subtema, 3.1.3. JavaScript combinado con HTML, se expondrá cómo funciona
JavaScript en un documento HTML. Esto hace posible que cuando se visualice la página
web en un navegador, se observe el funcionamiento de lo que se programó en JavaScript.
A la combinación de JavaScript con HTML se le conoce como JavaScript interno (Gutiérrez,
2009).
En el cuarto subtema, 3.1.4 JavaScript y PHP, se expondrá la utilización y funcionamiento
de los dos lenguajes de programación web: JavaScript y PHP, lo que permitirá que las
páginas sean más interactivas.
3.1.1. Objetos, funciones y métodos sobre JavaScript
En la creación de una página web donde se requieran recursos de interactividad y
funcionalidades diversas, es posible utilizar objetos, funciones y métodos de
JavaScript.
En JavaScript se identifican una serie de objetos sobre los que se puede interactuar, tales
como las ventanas, las páginas, las imágenes o los formularios, por ejemplo, el objeto
ventana tendrá, entre otras, una propiedad que sea el de su ancho. Un método funciones,
en el caso de JavaScript, asociado a este objeto será la que abre una nueva ventana.
Es posible crear objetos propios o utilizar los implementados por el lenguaje JavaScript.
Esto quiere decir que tiene una serie de propiedades asociadas a él. Para acceder a ellas,
según Goodman (2007), se declara de la siguiente manera:
nombre_objeto.nombre_método (argumentos)
nombre_objeto.nombre_propiedad
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 8
Se expone a continuación un ejemplo para entender el funcionamiento de los objetos de
JavaScript. Se asignará como nombre de objeto Profesor, con tres propiedades: nombre,
año de nacimiento y nacionalidad:
profesor.nombre = “Monserrat Millán”
profesor.anio_nacimiento = 1986
profesor.nacionalidad = “Mexicana”
Según este ejemplo, para acceder a las distintas propiedades del objeto se deberá indicar
el nombre del dicho objeto y de la propiedad, ambos separados por un punto.
Se puede decir, con base en Gutiérrez (2009), que “las funciones sobre JavaScript son una
serie de instrucciones que realizan una determinada tarea. A las funciones se le inserta un
nombre que luego puede ser utilizado en el código de la página web. Esto quiere decir que
las funciones son la base JavaScript por lo cual una función es un conjunto de sentencias
de JavaScript que realizan algunas tareas específicas” (p. 92).
Antes de utilizar una función de JavaScript en el código de la página, se explicará qué
operaciones son las que debe hacer la función. La función en JavaScript se define y se
representa de la siguiente manera:
function nombredelafunción (argumento1, argumento2,...)
{
instrucciones que debe realizar la función
}
Función en JavaScript. Fuente: Gutiérrez, 2009.
A continuación, se muestra un ejemplo sencillo en el que se define una función llamada
bienvenidos, que posteriormente mostrará la siguiente cadena de texto:
function bienvenidos ()
{
document.write (“ Se les da la bienvenida a los alumnos de
la carrera en Ingeniería en Desarrollo de Software”);
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 9
}
Ejemplo de función en JavaScript
En este ejemplo, lo que se hace es llamar a la función. Basta con poner el nombre seguido
de los paréntesis. En este caso, se define una función que muestra texto en la posición
actual del cursor.
Como expresa Goodman (2007). “Un método es una función asociada a un objeto y
particular a los objetos del tipo que la define. Los métodos se definen en el mismo sitio
que las funciones y de las misma manera, asociándolos posteriormente a un objeto
existente” (p. 85). Significa que un método es una acción que se ejecuta sobre los datos de
un objeto.
La sintaxis para definir un método en JavaScript es la siguiente:
Objeto.nombremetodo = nombre función
Sintaxis para definir un método en JavaScript. Fuente: Goodman, 2007.
La llamada del método, se hace de la siguiente forma:
Objeto.nombremetodo (parametro1, parametro2, parametro3…)
Sintaxis para hacer la llamada del método en JavaScript. Fuente: Goodman, 2007.
A continuación, se expone un ejemplo con base en objetos, funciones y métodos en
JavaScript. Para crear objetos propios, se mostrará un ejemplo en dos formas diferentes:
Ejemplo1
En éste, sólo se declara el nombre de la función y las variables que la compondrán.
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 10
Donde:
this hace siempre referencia al objeto actual.
Ejemplo 2
Aquí se creará una instancia del objeto usando new, atributo del objeto de JavaScript.
Para ello se le asigna una función al objeto que calcule la edad del profesor. Para hacerlo
más simple, sólo se restará al año actual el año de nacimiento. Un objeto document
permite que se proporcione propiedades y métodos para poder acceder a otros objetos
dentro de todo el código de JavaScript. Claro está, esto depende de lo que se necesite.
La estructura para saber la edad del profesor con baseen el objeto document es la
siguiente:
function calcula_edad( ) {
var edad = 2014 - this.anio_nacimiento;
document.write(“Su edad es: <b>“ + edad + “</b>)
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 11
}
La función se podría escribir en una línea, pero de esta forma puedes observar cómo
declarar una variable, explícitamente. El tipo se les asigna implícitamente, con base en el
objeto document. La utilización de los objetos, funciones y métodos sobre JavaScript en la
realización de la paginas web permite que sea más interactivo tu sitio web; por ejemplo,
cuando se requiere enviar un formulario y un campo obligatorio no está lleno, se genera
un aviso indicando que hace falta llenarlo antes del envío, y sólo se pueden enviar los
datos cuando se está conectado a una base de datos.
3.1.2. Eventos sobre JavaScript
En este subtema se revisarán los eventos de JavaScript. Es muy importante pues permite
que la página web pueda realizar varias acciones. Como expresa Remoaldo (2008), “los
eventos son acciones que suceden cuando el usuario realiza alguna acción sobre algún
control de la página web, como hacer un clic para activar un enlace, etcétera. También son
eventos, desplazar el ratón, teclear algo en una caja de edición, etcétera” (p. 187).
A continuación, se explican los objetos y propiedades de JavaScript que se integran en una
página web, según lo expuesto por Orós (2011):
Windows: es el objeto de más alto nivel, contiene las propiedades de la
ventana, trabaja con frames, un objeto Windows es generado para cada
frame.
Document: agrupa las propiedades del documento actual, tales como el
título, formularios, imágenes, colores de texto o fondo.
History: objeto que contiene las propiedades que representan a las URL que
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 12
el usuario ha visitado anteriormente.
Location: contiene las propiedades de la URL activa. (p. 121)
JavaScript trabaja con eventos gracias a los manipuladores o manejadores de eventos que
incorpora. Los eventos son sucesos que ocurren en el sistema cuando un usuario ejecuta
algún tipo de acción.
A continuación se muestran los tipos de eventos de JavaScript:
Tipos de
eventos en
Java Script
Recursos donde se
aplican
Funcionalidad Controlador de
eventos
Abort Imágenes El usuario cancela la carga de una
imagen (por ejemplo, hace clic en
un enlace o en el botón Stop).
OnAbort
Blur Ventanas y
todos los
elementos de
un formulario
El usuario quita el foco (el punto
de inserción) de entrada de
ventana o formulario de elemento.
OnBlur
Change Se utiliza en los
elementos que
componen un
formulario ( text
fields,
textareas, select) lists
El usuario cambia el valor del
elemento que compone un
formulario.
OnChange
Clic Se utiliza en buttons,
radio
buttons, checkboxes,
submit buttons,
reset buttons, links
El usuario da clic en el elemento de
formulario o enlace. Esto para
mostrar un cuadro de diálogo con
un mensaje de información, o una
confirmación antes de ser enviada
a la base de datos.
OnClick
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 13
DragDrop Ventanas El usuario suelta un objeto en la
ventana del navegador, como la
caída de un archivo en un
navegador.
OnDragDrop
Error Imágenes,
Ventanas
Permite la carga de un documento
o imágenes que causan un error.
OnError
Focus Ventanas y
todos los elementos
de los formularios
Permite la entrada en la ventana o
elemento de formulario.
OnFocus
KeyDown Documentos,
Imágenes, enlaces,
áreas de texto.
Permite que el usuario presione la
tecla abajo.
OnKeyDown
KeyPress Documentos,
imágenes, enlaces,
áreas de texto
Permite que el usuario presione la
tecla arriba.
OnKeyPress
KeyUp Documentos,
imágenes, enlaces,
áreas de texto
Permite que el usuario libere una
tecla.
OnKeyUp
Load Documentos El usuario carga la página en el
navegador.
OnLoad
MouseDown Documentos,
botones, enlaces
El usuario pulsa un botón del
ratón.
OnMouseDown
MouseMove Nada, esto es por
default
El usuario mueve el cursor. OnMouseMove
MouseOut Áreas y enlances Desplaza el cursor del usuario o de
un cliente al lado de la imagen del
mapa o enlace.
OnMouseOut
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 14
MouseOver Enlaces El usuario mueve el cursor sobre
un
Enlace.
OnMouseOver
MouseUp Documentos El usuario libera un botón del
ratón.
OnMouseUp
Eventos de JavaScript. Fuente: Sánchez, 2001.
A continuación, se expone una lista de los eventos de los JavaScript más comunes y se
menciona cuándo se producen. La diferencia de estos eventos es que, sobre las etiquetas,
pueden actuar más específicamente con HTML.
Evento Se produce al… Etiqueta HTML
onLoad Cargar el documento HTML. BODY
onUnload Abandonar el documento HTML. BODY
onMouseOver Pasar el ratón por encima del enlace. A
onMouseOut Sacar el ratón de encima del enlace. A
onClick Dar clic sobre un link o un campo de
formulario.
A, FORM
onSubmit Enviar el formulario. FORM
onFocus Activar un campo de edición de un formulario. INPUT
onSelect Seleccionar un campo de edición de un
formulario.
INPUT
onBlur Deseleccionar un campo de edición de un
formulario.
INPUT
onChange Cambiar el contenido de un campo de edición,
o de selección de un formulario.
INPUT, SELECT
Eventos de JavaScript que actúan sobre las etiquetas HTML. Fuente: Sánchez, 2001.
Estos eventos se utilizan, por ejemplo, si el usuario da clic sobre el botón de la página
web. El correspondiente manejador del evento clic, en este caso Onclick, registrará la
acción y realizará las tareas que se le hayan asignado.
A continuación se muestra un ejemplo de la forma en que se programa onClick en
JavaScript:
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 15
Ejemplo de programación del evento onClick en JavaScript
En este ejemplo se utiliza el evento onClick, lo que hace que el usuario cuando da clic en
el elemento llamado Entrar se abra una venta que dice Bienvenidos alumnos de Ingeniería
en Desarrollo de Software.
En la imagen siguiente se muestra el resultado del código evento onClick:
Ejemplo de aplicación onClick. Basado en: Sánchez, 2001.
Es posible visualizar en todos los navegadores web los eventos programados en las
páginas mediante JavaScript.
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 16
Por último, es muy importante considerar que también existen los objetos del navegador.
Son lo que permiten controlar la navegación de una página web de manera dinámica. Se
utilizan cuando se carga una página web en el navegador y se crea un número de objetos
característicos, según el contenido de dicha página (Sánchez, 2001).
Los eventos sobre JavaScript son utilizados para ejecutar funciones que no serán iniciadas
hasta que el evento se ejecute; por lo tanto, te ayudarán en la realización de tus
formularios; por ejemplo, cuando el usuario llena un formulario y da clic en enviar, lo que
hace el evento es hacer que se guarde la información en la base de datos, y se genere un
formato en PDF integrando o almacenando la información con la que fue llenado el
formulario, en este caso el evento realizó dos acciones:
• Almacenar la base de datos
• Generar un formato PDF
3.1.3. JavaScript combinado con HTML
En este subtema revisarás la importancia que tiene JavaScript combinado con HTML.
Como se ha dicho en las unidades anteriores, HTML es el lenguaje principal para el
funcionamiento de los demás lenguajes de programación web; en este caso, con
JavaScript permite que se visualice lo que se introdujo de código. Se podrá visualiza la
interfaz gráfica en lo navegadores web.
JavaScript es un sencillo lenguaje de programación que presenta una característica
especial:sus programas, llamados comúnmente scripts en las páginas HTML, se ejecutan
en todos los navegadores. Estos scripts normalmente consisten en funciones que son
llamadas desde el propio HTML cuando algún evento se acciona.
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 17
A continuación, se exponen ejemplos de la combinación de JavaScript con HTML. En el
siguiente ejemplo se mostrará la utilización de onClick y de funciones de JavaScript con
HTML (Brito, N. 2009):
Ejemplo del funcionamiento del evento onClick
Para consultar el resultado código anterior, así como el funcionamiento que tiene el
evento onClick y la función, revisa el video Ejemplo de aplicación del evento onClick y
explicación de su funcionamiento.
Para consultar el recurso de video Ejemplo de aplicación
del evento onClick y explicación de su funcionamiento da
clic en la imagen de la izquierda (es recomendable que
descargues el recurso para una mejor visualización).
En el siguiente ejemplo se expone el uso del evento JavaScript window.print (), según lo
expuesto por Brito, (2009):
http://youtu.be/SzqQa8LT68E
http://youtu.be/SzqQa8LT68E
http://youtu.be/SzqQa8LT68E
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 18
Ejemplo de uso del evento JavaScript window.print ()
Para observar el resultado de este código y la explicación del funcionamiento del evento
JavaScript window.print (), observa el video Ejemplo de aplicación del evento
window.print() y explicación de su funcionalidad.
Para consultar el recurso de video Ejemplo de aplicación del evento window.print() y
explicación de su funcionalidad, da clic en la imagen de la derecha (es recomendable que
descargues el recurso para una mejor visualización).
JavaScript puede programarse en un documento aparte del propio de HTML, pero esto no
quiere decir que no deba utilizarse en un HTML. Cuando se programa sólo en JavaScript se
guarda con la extensión .js. Una vez que se guardó con esta extensión, se construye la
página web en HTML y se manda llamar el documento, por ejemplo calendario.js, dentro
de la página web HTML como a continuación se muestra, según lo expuesto por Gutiérrez
(2009):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN" "http://www.w3.org/TR/xHTML1/DTD/xHTML1-
transitional.dtd">
http://youtu.be/ErgcHXosLqk
http://youtu.be/ErgcHXosLqk
http://youtu.be/ErgcHXosLqk
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 19
<HTML xmlns="http://www.w3.org/1999/xHTML" lang="en"
xml:lang="en">
<head>
<title>CAPTURA CONTROL COLABORADOR</title>
<!-- link calendar files -->
<script language="JavaScript"
src="calendar_us.js"></script>
<!--
#Layer1 {
position:absolute;
width:200px;
height:115px;
z-index:1;
left: 825px;
top: 200px;
}
-->
</style>
</head>
<body>
<div id="Layer1">
<form name="testform">
<input type="text" name="testinput2" id="myOtherInput"
/>
<script language="JavaScript">
// whole calendar template can be redefined per
individual calendar
var A_CALTPL = {
'weekdays' : ['do', 'lu', 'ma', 'mi', 'ju', 'vi',
'sa'],
'yearscroll': true,
'months' : ['Enero', 'Febrero', 'Marzo',
'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre',
'Octubre', 'Noviembre', 'Diciembre'],
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 20
'weekstart': 0,
'centyear' : 70,
'imgpath' : 'img/'
}
new tcal ({
// if referenced by ID then form name is not
required
'controlname': 'myOtherInput'
}, A_CALTPL);
</script>
</form>
</div>
</body>
</HTML>
En el ejemplo anterior se muestra cómo se utiliza la sintaxis siguiente:
<script language="JavaScript" src="calendar_us.js"></script>
La sintaxis anterior permite llamar la estructura del calendario (Gutiérrez, 2009). El archivo
calendar_us.js tiene código de JavaScript. Para revisar el ejemplo anterior, observa el
video Ejemplo de aplicación de ficheros externos con JavaScript, donde observarás cómo
se elabora un calendario mediante un fichero en JavaScript con la combinación de HTML.
Es decir, observarás el resultado del código anterior y una explicación sobre la
funcionalidad del fichero calendar_us.js:
Para consultar el recurso de video Ejemplo de aplicación de ficheros
externos con JavaScript, da clic en la imagen de la izquierda (es
recomendable que descargues el recurso para una mejor
visualización).
A continuación, se muestra un ejercicio con el evento onMouseOver y la función de
JavaScript, específicamente con HTML, de acuerdo con Brito (2009):
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
http://youtu.be/lI-CFPW34u4
http://youtu.be/lI-CFPW34u4
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 21
function carga(nom)
{
nombo = nom + "2.jpg";
document.images[nom].src = nombo;
}
function descarga(nom)
{
nombo = nom + ".jpg";
document.images[nom].src = nombo;
}
</SCRIPT>
</HEAD>
<BODY bgcolor="red">
<a href="ejer1.HTML" onmouseover="carga('dos.jpg')"
onmouseout="descarga('dos.jpg')";>
<img src="unad.jpg" name="unad" border=0></a>
<p>
<a href="ejercicio2.HTML" onmouseover="carga('unad')"
onmouseout="descarga('unad')";> <img
src="dos.jpg" name="dos" border=0></a>
</BODY>
</HTML>
Para observar el resultado del ejemplo anterior respecto a la función de JavaScript,
específicamente con HTML, se mostrará el resultado con el evento onMouseOver. Revisa
el recurso de video Ejemplo de aplicación de código con el evento onMouseOver.
Para consultar el recurso de video Ejemplo de aplicación de código con el evento
onMouseOver da clic en la imagen de la derecha (es recomendable que descargues
el recurso para una mejor visualización).
Se realizará otro ejercicio de JavaScript con combinación HTML. En el siguiente código se
utiliza la condición IF, según lo planteado por Remoaldo (2008):
http://youtu.be/COkm2Y8tzik
http://youtu.be/COkm2Y8tzik
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 22
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN"
"http://www.w3.org/TR/xHTML1/DTD/xHTML1-transitional.dtd">
<HTML xmlns="http://www.w3.org/1999/xHTML">
<head>
<meta http-equiv="Content-Type" content="text/HTML;
charset=iso-8859-1" />
<title>Ejercicio 5 - Estructuras de control, IF</title>
<script type="text/JavaScript">
var numero1 = 5;
var numero2 = 8;
if(numero1 <= numero2) {
alert("número1 no es mayor que número2");
}
if(numero2 >= 0) {
alert("número2 es positivo");
}
if(numero1 < 0 || numero1 != 0) {
alert("número1 es negativo o distinto de cero");
}
if(++numero1 < numero2) {
alert("Incrementar en 1 unidad el valor de número1 no lo
hace mayor o igual que
número2");
}
</script>
</head>
<body>
<p>Esta página muestra el uso básico de la estructura de
control IF</p>
</body>
</HTML>
Para observar el resultado del ejemplo anterior, revisa el video Condición IF en JavaScript y
HTML.
http://youtu.be/COkm2Y8tzik
http://youtu.be/COkm2Y8tzik
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 23
Para consultar el recurso de video Condición IF en JavaScript y HTML da
clic en la imagen de la derecha (es recomendable que descargues el
recurso para una mejor visualización).
En el siguiente ejemplo, se expone un cuadro de mensajes utilizando métodos de alerta,
según lo expuesto por Goodman (2007).
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN"
"http://www.w3.org/TR/xHTML1/DTD/xHTML1-transitional.dtd">
<HTML xmlns="http://www.w3.org/1999/xHTML">
<head>
<meta http-equiv="Content-Type" content="text/HTML;
charset=iso-8859-1" />
<title>Mostrar mensajes complejos</title>
<script type="text/JavaScript">
var mensaje = "¡Recuerda actualizartu antivirus cada 30
días! \UnadMexico \'septimo semestre\' \n alert(mensaje);
</script>
</head>
<body>
<p>Esta página muestra mensajes de UNADM</p>
</body>
</HTML>
Para visualizar el resultado del cuadro de mensajes utilizando los métodos de alerta que
se exponen en el ejemplo anterior, revisa el video Ejemplo de aplicación del método de
Alert.
Para consultar el recurso de Ejemplo de aplicación del método de Alert, da clic
en la imagen de la derecha (es recomendable que descargues el recurso para
una mejor visualización).
En este subtema, se expuso la importancia de la utilización del lenguaje de programación
de HTML para JavaScript. Es recomendable que, para la construcción de tu sitio web,
http://youtu.be/PwLPCNNxLzU
http://youtu.be/PwLPCNNxLzU
http://youtu.be/COkm2Y8tzik
http://youtu.be/PwLPCNNxLzU
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 24
ingreses códigos de JavaScript a tus páginas web, ya que hará que tu sitio sea más
interactivo. Recuerda que el código de programa de JavaScript, llamado script, se
introduce directamente en el documento de HTML y no necesita ser compilado. Es el
propio navegador el que se encarga de traducirlo.
3.1.4. JavaScript y PHP
JavaScript es un lenguaje de programación que permite realizar funcionalidades
específicas dentro las páginas web del lado del cliente, y PHP es un lenguaje que se basa
en la creación y conectividad de las bases de datos del lado del servidor. Esto quiere decir
que el valor no pasa de JavaScript a PHP, lo que realizan estos dos lenguajes de
programación web consiste en presentar el resultado en pantalla como formato de texto
(Sánchez, 2001).
JavaScript facilita acciones tales como enviar un error al usuario cuando se esté realizando
o llenando un formulario y no esté completo o listo para ser almacenado en la base de
datos elaborada en PHP. Al dar clic en enviar, aparecerá un cuadro de diálogo con la
indicación de que no está completo el formulario. JavaScript permitirá al usuario avisarle
que no ha completado el formulario en su totalidad. Otro ejemplo: en un formulario que
pida la fecha se introduce el calendario que está hecho en JavaScript, ahí el usuario sólo
busca la fecha y se almacena cuando se la envía a la base de datos.
Trabajar con estos dos lenguajes de programación web depende de la creación de la lógica
de cada programador. En este caso tú, como ingeniero en Desarrollo de Software, tendrás
la facilidad para trabajar con estos lenguajes y hacer infinidades de páginas, ya que tienes
los conocimientos necesarios de programación. También dependerá de lo que solicite la
empresa. A continuación, se muestra un código de programación web utilizando los dos
lenguajes: PHP y JavaScript. El siguiente código tiene la finalidad de permitir que, cuando
el usuario llene el formulario, los datos se almacenen en la base y puedan ser enviados a
una dirección de correo electrónico, ya definida desde el código (Goodman, 2007).
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 25
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN" "http://www.w3.org/TR/xHTML1/DTD/xHTML1-
transitional.dtd">
<HTML xmlns="http://www.w3.org/1999/xHTML">
<head>
<meta http-equiv="Content-Type" content="text/HTML;
charset=utf-8" />
<title>:::::LINEA DE COMPRAS:::::</title>
<!-- Archivo de validación colocar dentro de HEAD /HEAD -->
<script type="text/JavaScript" src="validar.js"></script>
<!-- Fin Archivo de validación -->
<style type="text/css">
body,td,th {
font-family: "Arial Black";
font-size: 18px;
color: #56006A;
}
a:link {
color: #56006A;
}
a:visited {
color: #56006A;
}
a:hover {
color: #56006A;
}
a:active {
color: #56006A;
}
</style>
<script type="text/JavaScript">
<!--
function doubleSubmit(f)
{
// submit to action in form
f.submit();
// set second action and submit
f.target="_parent";
f.action="conex.php";
f.submit();
Este código está elaborado en
JavaScript. Es una función con un
método. Esto permite que el formulario
en PHP sea contestado por el usuario,
pueda ser enviado a la base de datos
y, al mismo momento, abrir el correo
electrónico con los datos que se
capturaron al rellenar el formulario
PHP.
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 26
return false;
}
//-->
</script>
</head>
<body>
<P align="right"><a href="<?php echo $logoutAction
?>">CERRAR</a></P>
<p align="center"><img src="imagenes/NEZA1.jpg" width="230"
height="314" /></p>
<form id="form1" name="form1" method="post" action="">
<p>
<label for="id"></label>
</p>
<fieldset>
<p>
<label for="textfield">Número de orden</label>
:
<input name="num_orden" type="text"
id="num_orden"value="<?php echo $next_id; ?>" disabled />
</p></fieldset>
<p> </p>
<blockquote>
<blockquote>
<blockquote>
<blockquote>
<blockquote>
<blockquote>
<fieldset>
<marquee>
<p>::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
::::::::
</p></marquee>
</fieldset>
<fieldset>
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 27
<legend align="left"><font color="#FFE000">Línea de
compras</font></legend>
<form>
<p> Clase de producto:
<select name="id" id="id" onchange="submit()">
<option value=""> </option>
<?php
do {
?>
<option value="<?php echo
$row_Recordset1['id']?>"<?php if
(!(strcmp($row_Recordset1['id'], $_POST['id']))) {echo
"selected=\"selected\"";} ?>><?php echo
$row_Recordset1['cod_depa']?></option>
<?php
} while ($row_Recordset1 = mysql_fetch_assoc($Recordset1));
$rows = mysql_num_rows($Recordset1);
if($rows > 0) {
mysql_data_seek($Recordset1, 0);
$row_Recordset1 = mysql_fetch_assoc($Recordset1);
}
?>
</select></p>
Producto:
<select name="id_producto" id="id_producto"
onchange="submit()">
<option value="">Seleccione una opcion:</option>
<?php
do {
?>
<option value="<?php echo
$row_Recordset2['id_producto']?>"<?php if
(!(strcmp($row_Recordset2['id_producto'],
$_POST['id_producto']))) {echo "selected=\"selected\"";}
?>><?php echo $row_Recordset2['nombreproducto']?></option>
<?php
} while ($row_Recordset2 = mysql_fetch_assoc($Recordset2));
$rows = mysql_num_rows($Recordset2);
if($rows > 0) {
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 28
mysql_data_seek($Recordset2, 0);
$row_Recordset2 = mysql_fetch_assoc($Recordset2);
}
?>
</select>
</form>
<form
action="mailto:lbellazetin@undad.com.mx?subject= ORDEN DE
COMPRAS&body=Se requiere autorizar la Orden Numero: <?php
echo $next_id; ?> con fecha de <?php include('fecha.php')?>-
<?php include('hora.php') ?> " enctype="multipart/form-data"
method="post" onsubmit="doubleSubmit(this);">
<input name="id_producto" type="hidden" id="id_producto"
value="<?php echo $id; ?>" />
<label for="nombreproducto"></label>
<select name="nombreproducto" id="nombreproducto">
<option value="">Seleccione otra vez el
producto:</option>
<?php
do {
?>
<option value="<?php echo
$row_Recordset4['nombreproducto']?>"<?php if
(!(strcmp($row_Recordset4['nombreproducto'],
$_POST['nombreproducto']))) {echo "selected=\"selected\"";}
?>><?php echo $row_Recordset4['nombreproducto']?></option>
<?php
} while ($row_Recordset4 = mysql_fetch_assoc($Recordset4));
$rows = mysql_num_rows($Recordset4);
if($rows > 0) {
mysql_data_seek($Recordset4, 0);
$row_Recordset4 = mysql_fetch_assoc($Recordset4);
}
?>
</select>
Proveedor:
<select name="proveedor" id="proveedor">
En estaparte del código, se observa la forma en que se declaran los
correos electrónicos a donde será enviada la información que se
introduzca al llenar el formulario elaborado con PHP.
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 29
<option value="">Seleccione una opcion:</option>
<?php
do {
?>
<option value="<?php echo
$row_Recordset3['proveedor']?>"<?php if
(!(strcmp($row_Recordset3['proveedor'],
$_POST['proveedor']))) {echo "selected=\"selected\"";}
?>><?php echo $row_Recordset3['proveedor']?></option>
<?php
} while ($row_Recordset3 = mysql_fetch_assoc($Recordset3));
$rows = mysql_num_rows($Recordset3);
if($rows > 0) {
mysql_data_seek($Recordset3, 0);
$row_Recordset3 = mysql_fetch_assoc($Recordset3);
}
?>
</select>
<p>Otro Producto/Productos Varios**
:
<textarea name="otro_producto"
id="otro_producto"></textarea>
<label for="comprar"></label>
<label for="cotizar"></label>
Cantidad:
<input name="cantidad" type="text" id="cantidad" size="15" />
</p>
<h6>**(En caso si no se encuentra el Producto)</h6>
<p>Unidad:
<select name="unidad" size="1" id="unidad" value="<?php echo
$_POST[departamento] ?>" >
<option value="Bolsa(s)">Bolsas(s)</option>
<option value="Caja(s)">Caja(s)</option>
<option value="Galon(es)">Galon(es)</option>
<option value="Litro(s)">Litro(s)</option>
<option value="Metro(s)">Metro(s)</option>
<option value="Milimetro(s)">Milimetro(s)</option>
<option value="Pieza(s)">Pieza(s)</option>
<option value="Paquete(s)">Paquete(s)</option>
</select>
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 30
Solicitar autorización:
<input name="autorizacion" type="checkbox"
id="autorizacion" value="Solicito Autorización" />
</p>
<p>
Solicitante:
<label for="requisitor"></label>
<input name="requisitor" type="text" id="requisitor"
size="40" />
<input name="estado" type="hidden" id="estado"
value="Nuevo" />
</p>
<p>Departamento:
<label for="select2"></label>
<select name="departamento" size="1" value="<?php echo
$_POST[departamento] ?>" >
<option value=" " ></option>
<option value="AD-Administracion">AD-Administración</option>
<option value="AF-Atencion Familiar">AF-Atención
familiar</option>
<option value="AP-Atencion al Publico">AP-Atencion al
público</option>
<option value="DG-Direccion General">DG-Dirección
general</option>
<option value="DH-Desarrollo Humano">DH-Desarrollo
humano</option>
<option value="DM-Direccion Medica" selected="selected">DM-
Direccion Medica</option>
<option value="DO-Direccion de Operaciones">DO-Direccion de
Operaciones</option>
<option value="EN-Enfermeria">EN-Enfermeria</option>
<option value="IN-Inter Consultantes">IN-Inter
Consultantes</option>
<option value="IS-Integracion Social">IS-Integración
social</option>
<option value="MA-Medico Acompañante">MA-Médico
acompañante</option>
<option value="PE-Proyectos Especiales">PE-Proyectos
especiales</option>
<option value="PS-Psicologia">PS-Psicología</option>
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 31
<option value="RM-Recursos Materiales">RM-Recursos
materiales</option>
<option value="RP-Relaciones Publicas">RP-Relaciones
públicas</option>
<option value="SI-Sistemas">SI-Sistemas</option>
<option value="TF-Terapia Fisica">TF-Terapia física</option>
<option value="TO-Terapia Ocupacional">TO-Terapia
ocupacional</option>
<option value="TP-Terapia de Lenguage">TL-Terapia de
lenguage</option>
<option value="VO-Voluntaria">VO-Voluntaria</option>
</select>
Fecha de orden:
<label for="textfield"></label>
<input type="text" name="fecha_orden"
readonly="readonly" style="width:auto" value="<?php
include('fecha.php')?>-<?php include('hora.php')?>" size="22"
>
</p>
<blockquote>
<blockquote>
<p> Observación:</p>
<blockquote>
<blockquote>
<p align="left">
<label for="otro_producto">
<textarea name="observacion" id="observacion"
cols="45" rows="5"></textarea>
</label>
</p>
</blockquote>
<p align="center" id="observacion" name="observacion"
cols="45" rows="5"> </p>
<blockquote>
<p align="left">
<label for="textfield"></label>
</p>
</blockquote>
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 32
</blockquote>
</blockquote>
</blockquote>
<p align="center">
<label for="id_producto"></label>
<input type="hidden" name="num_orden" value="<?php echo
$next_id; ?>"/>
<input type="submit" name="enviar" id="enviar" value="Enviar"
onclick="check(this.value)"/>
<INPUT type="reset" name="borrar" value="Borrar">
</p>
<p>
<label for="id_proveedor"></label>
</p>
</form></form>
</fieldset>
<fieldset>
<marquee>
<p>::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
::::::::
</p></marquee>
</fieldset>
<fieldset>
<p> </p>
<p> </p>
</fieldset>
</body>
</HTML>
<?php
mysql_free_result($Recordset1);
Se muestra el código de JavaScript donde se utilizó el método para
realizar las dos acciones utilizando el evento onclick.
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 33
mysql_free_result($Recordset2);
mysql_free_result($Recordset3);
mysql_free_result($Recordset4);
?>
Revisa el resultado del ejemplo anterior en el video Ejemplo de combinación de JavaScript
con PHP .
Para consultar el recurso de video Ejemplo de combinación de JavaScript con
PHP, da clic en la imagen de la izquierda (es recomendable que descargues el
recurso para una mejor visualización). .
Como observaste, realizar páginas web con JavaScript y PHP es muy interesante, sólo
tiene como límite tu creatividad y lógica para hacer que tus páginas web cuenten con los
estándares de calidad y capten cada vez más usuarios. En este tema visualizaste que
trabajar con JavaScript no es complicado, pues algunos de sus códigos ya los aplicaste en
otros lenguajes de programación, pues sólo cambió la manera de declarar. También
observaste que, para ver si es correcto el código, es necesario que se trabaje con HTML, lo
que permitirá visualizar el navegador web. JavaScript no se compila como otros lenguajes
de programación, con esto tú podrás agregar código de JavaScript en las páginas ya
desarrolladas en tu proyecto de sitio web en la Unidad 2. Diseño de sitios web, y hacer
que se vuelvan más interactivas.
3.2. Estructura ASP
En este subtema se explicará el lenguaje de programación web ASP. El objetivo de usar
ASP es que permite obtener, de forma simple y variada, información específica de los
requerimientos de la creación de páginas web. Ya no es necesario crear nuevas páginas
cada vez que se desee subir nueva información, ni remodelar páginas publicadas, con la
http://youtu.be/uCo8SpIL31Y
http://youtu.be/uCo8SpIL31Y
http://youtu.be/uCo8SpIL31Y
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 34
finalidad de lograr tener al día toda la información. En la actualidad, con ASP se crean
plantillas para cualquier sitio web en general. ASP no es más que páginas en HTML con
algunos cambios; por ejemplo, la conexión de base de datos. Recuerda que HTML no hace
conectividad con el servidor web para lo conexión de la bases de datos, y con ASP sí.
Normalmente, las paginas ASP tiene la extensión .asp y pueden contener comandos de
HTML, pero aprender ASP se vuelve más interesante cuando se integra en la página
funciones adicionales; esto es, a la líneas de programas que el usuario no ve ni detecta en
su navegador porque se procesan en el servidor.
El término ASP sonlas siglas de active server page, método para crear programas que se
ejecutan en un servidor de Web. Como sucede en otros lenguajes de programación, ASP
tiene su estructura de código. Dado que se encuentra dentro del código de HTML, es
necesario indicarle al servidor qué partes están escritas en un lenguaje y cuales en otro. Al
igual que HTML, el código ASP tiene su etiqueta de inicio y fin, por lo cual en ASP se
declara de la siguiente forma:
<% línea de código %>
Esta sintaxis es muy importante, ya que con saber cómo va estructurada se podrá
identificar que es una página web ASP; por otro lado, se podrá trabajar con bases de
datos.
En este tema se abordarán los siguientes subtemas:
En el subtema 3.2.1. Contenidos básicos ASP, se visualizará que ASP es un archivo de texto
con extensión .asp, que contiene cualquier combinación de los siguientes elementos:
HTML y lenguaje del servidor web (Wenz, Rennhaus y Kordwing, 2001).
En el subtema 3.2.2. Objetos y Funciones de ASP, se aprenderá que en ASP hay algunos
objetos estándar predefinidos, que juegan un papel determinante en la aplicación de las
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 35
posibilidades de ASP y sus funciones. Hay algunas prácticas para manejar arrays, subtipos
y datos de fecha y hora para aplicarlas a tus páginas web (Wenz, Rennhaus y Kordwing,
2001).
3.2.1. Contenidos básicos ASP
Las necesidades de la empresas están siendo cambiadas por los continuos avances
tecnológicos y exigencia actuales. Estos cambios posibilitan un diseño y la maximización
de recursos y herramientas para el desarrollo de aplicaciones más activas y poderosas.
Facilitan el desarrollo del aprendizaje y creatividad de los programadores en un tiempo
mucho menor, permiten una interacción más funcional con sus clientes.
El lenguaje de programación ASP, en todos los ámbitos actuales desde empresariales
hasta educativos, ha tomado una enorme relevancia por tener una gran facilidad y mucho
poder para su utilización, así como permitir la creación de aplicaciones más potentes y
funcionales para las organizaciones (Wenz, Rennhaus y Kordwing, 2001).
A continuación, se muestra un ejercicio pequeño con ASP. Este código muestra un
mensaje:
<!DOCTYPE HTML>
<HTML>
<body>
<%
="Bienvenidos alumnos de Ingeniería en Desarrollo de
software"
%>
</body>
</HTML>
De acuerdo con Valenzuela (s. f.):
¿En qué aplicaciones se puede obtener los mejores resultados con las
páginas ASP? Pues básicamente, son 2 los tipos de aplicaciones que se le
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 36
pueden dar de manera importante.
Una, son las llamadas Listas de correo donde los usuarios ingresan sus Emails
y se les envían información de forma periódica. Estas listas, suelen solicitar
información adicional del usuario y todo esto conforma una Base de Datos
realmente importante. En este caso, se manejan los conceptos de Alta y de
Baja, es decir, de ingreso y eliminación de un registro. Además de esto, si en
el formulario de inscripción, se solicita, por ejemplo, una dirección URL del
usuario, la configuración de su PC, sus hobbies, etcétera, todo esto
representa un cúmulo de información que puede ser utilizada por todos,
previa Búsqueda según criterios propios. (p. 1)
ASP utiliza principalmente el lenguaje visualbasicscript que no es más que una derivación
del Visual Basic. Sin embargo, es posible programar páginas ASP en JavaScript, su
declaración de la utilización de JavaScript o Visual Basic son las siguientes: (Valenzuela, s.
f.).
<% language=”vbscript” %> si se utiliza visual basic sript en
servidor para programa en ASP.
<% language=”jscript” %> si se utiliza JavaScript en servidor
para programa en ASP.
Es muy importante tener presente estas sentencias de ASP, ya que permiten realizar las
plantillas para las páginas web con la conectividad del servidor; por lo particular, con el
que se trabaja más es con visualbasicscript. A continuación se muestra un ejemplo de
aplicación del código con VBScript:
<% language=”vbscript” %>
<HTML>
<body>
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 37
Hola ingeniero en Desarrollo de Software la UnADM te da la
bienvenida el día de hoy: <%=now( )%>
</HTML>
</body>)
En este ejemplo con la etiqueta <%=now( )%> se está llamado la fecha y la hora, por lo
tanto el resultado es:
Hola ingeniero en Desarrollo de Software, La UnADM te da la bienvenida el día de hoy:
16/4/2014 20:00 PM
Como se observa en el ejemplo anterior, el cliente no recibe el código ASP, sino el
resultado de la ejecución.
Es muy importante tener el conocimiento básico de ASP, ya que permitirá saber cómo se
trabaja con ASP para realizar plantillas, y que se tenga comunicación con el servidor web.
Por otro lado, ASP trabaja con HTML. El único cambio es que tiene una sintaxis específica
para trabajar con dos lenguajes de programación Visual Basic y JavaScript. Tú, como
ingeniero en Desarrollo de Software, no tendrás complicación en trabajar con ASP, ya que
tienes conocimientos de varios lenguajes de programación. El punto importante y que se
ha mencionado es que tengas creatividad y lógica, para que realices infinidades de sitios
web. Por lo tanto, ASP no permite que se pueda ingresar texto, etiquetas HTML ni scripts,
a menos que estén en un archivo ASP que se ejecuta en el servidor.
3.2.2. Objetos y funciones de ASP
Los objetos definen y realizan funciones complejas. Su aplicación representa una forma
de normalizar la programación en ASP. Los objetos y funciones son muy importantes para
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 38
la realización de las páginas web. En ASP, hay algunos objetos estándar predefinidos que
juegan un papel determinante en la aplicación de sus posibilidades, y son los siguientes:
Objetos Concepto
Objeto Request Permite obtener información de un
visitante.
Objeto Response Permite enviar la salida para el usuario
desde el servidor.
Objeto Session Permite almacenar información o cambiar
la configuración de una sesión de usuario.
Objeto Server Se utiliza para acceder a las propiedades y
métodos en el servidor.
Objeto Application Permite almacenar y acceder a las variables
desde cualquier página, al igual que el
objeto Session.
Objeto Drive Permite obtener información acerca de una
unidad de disco local o en un recurso
compartido de red.
Objetos integrados de ASP. Fuente: Wenz, Rennhaus y Kordwing, 2001.
Ejemplo de aplicación del objeto Response:
<!DOCTYPE HTML>
<HTML>
<body>
<%
response.write("<h2>Programación Web 1 de la carrera de la
Ingeniería en Desarrollo de Software!</h2>")
%>
<%
response.write("<p style='black'></p>")
%>
</body>
</HTML>
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 39
El resultado del código anterior se caracteriza con el objeto response, porque sólo manda
llamar en la interface lo que fue declarado con response.write, tal como se muestra a
continuación:
Ejemplo de uso de response.write
Ejemplo de objeto Response de ASP:
<!DOCTYPE HTML>
<HTML>
<body>
<%
randomize()
r=rnd()
if r>0.5 then
response.write("<a
href='http://www.unadmexico.mx/'>UnadMexico!</a>")
else
response.write("<a
href='https://www.facebook.com/UnAdMexico?ref=ts&fref=ts'>fac
ebook UnadMexico!</a>")
end if
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 40
%>
<p>
Este ejemplo muestra un enlace, cada vez que se carga la página, se mostrará uno de los
dos enlaces: UnadMexico! o facebook UnadMexico! Hay una probabilidad del 50% para
cada uno de ellos.
</p>
</body>
</HTML>
El resultado del código anterior se muestra a continuación:
Ejemplo de uso de objeto response de ASP
A continuaciónse expone un ejemplo de objeto Server de ASP:
<!DOCTYPE HTML>
<HTML>
<body>
<%
Set fs = Server.CreateObject("Scripting.FileSystemObject")
Set rs = fs.GetFile(Server.MapPath("demo_lastmodified.asp"))
modified = rs.DateLastModified
%>
Último archivo modificado: <%response.write(modified)
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 41
Set rs = Nothing
Set fs = Nothing
%>
</body>
</HTML>
Se expone en la siguiente imagen el resultado del ejemplo anterior:
Ejemplo de objeto server de ASP
Por otro lado, las funciones en ASP facilitan las tareas de la programación de las páginas,
ya que se puede agrupar el código y ser reutilizado en la misma página. Las funciones de
ASP más utilizadas son: fecha y hora.
Fecha y hora en ASP pone a disposición sencillas rutinas para consultar la fecha actual del
sistema y la hora del sistema. Dependiendo de código, se ejecuta en el servidor dentro de
las rutinas ASP, o en el cliente. El resultado obtenido será la fecha y la hora del servidor, o
estos mismos datos relativos al cliente. A continuación se muestra el código (Wenz,
Rennhaus y Kordwing, 2001):
<!DOCTYPE HTML>
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 42
<HTML>
<body>
Fecha de Hoy: <%response.write(date())%>.
<br>
La Hora es: <%response.write(time())%>.
</body>
</HTML>
El resultado del ejemplo anterior es:
Fecha de hoy: 16/04/2014
La hora es: 22:00 pm
En este tema se habló del concepto básico del lenguaje y de los lenguajes de
programación específicos que ya tienen una sintaxis básica; por otro lado, se visualizaron
los objetos y funciones básicas y más utilizadas para la construcción de páginas web. ASP
se visualiza en el navegador IE. Recuerda que ASP es una tecnología de Microsoft. Este
lenguaje se utiliza dependiendo las necesidades de la empresa, y si ya tienes plantillas
elaboradas por ti, se te hará más fácil realizar tu sitio web.
3.3. Base de datos para Web
En la actualidad, las bases de datos son muy utilizadas en el mundo de la web ya sea para
ser visualizadas en Internet o intranet. Las bases de datos pueden ser utilizadas para cosas
tan sencillas como mantener un registro de tu agenda personal de teléfono, o tan
complicado como llevar toda la gestión de una gran empresa u organización. Una base de
datos se define como un conjunto de datos relacionados entre sí, organizados o
estructurados con información referente de algo.
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 43
Como expresa Meloni (2009), “las bases de datos son tratadas utilizando los sistemas
gestores de bases de datos SGBD o también llamados DBMS data base management
system que proporciona un conjunto de programas que acceden y gestionan esos datos”
(p. 10). Por lo tanto, se define una base de datos como información almacenada en una
computadora para que cualquier persona o programa autorizado pueda acceder a ella,
independientemente de su procedencia y del uso que haga.
Marín, Medina, Carrillo y Pons (2008), expresan que un gestor de base de datos “es un
conjunto de elementos software con capacidad para definir, mantener y utilizar una base
de datos” (p. 7).
Para la creación de bases de datos, el gestor de base de datos que se utilizará es MYSQL.
Éste crea un directorio o carpeta que contendrá los archivos de datos de esa base, al igual
que sucede en la relación entre carpetas y archivos. Por sí sola, la base no significa nada,
es similar a una carpeta, un simple contenedor, lo que guarda la información son los
objetos que tiene almacenados dentro, pues la información dentro de la bases de datos se
guarda en tablas, por lo que la base de datos es un conjunto de tablas.
Para crear bases de datos dentro de un sitio web, como ya se había mencionado en las
unidades anteriores, se necesita un servidor. Esto es de acuerdo con qué lenguaje de
programación web sea utilizando y qué sistema operativo. El servidor más recomendado y
utilizado por varios programadores es Apache, ya que es más factible para trabajar con las
bases de datos y estar administrando el sitio web. Para tener Apache se necesitan los
instaladores web AppServ o Xampp.
En el subtema 3.3.1 Tipo de bases de datos, aprenderás las diferentes bases de datos que
existen, porque las bases de datos pueden clasificarse de muchas maneras, depende del
manejo del contexto o a la utilidad de la misma, esto significa que depende de los
diferentes datos almacenados (Spona, 2010).
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 44
En el subtema 3.3.2 Instaladores de servidores web, aprenderás a utilizar los instaladores
web, ya que AppServ y Xampp tiene los mismo pasos para poder crear bases datos con sus
respectivas tablas.
El subtema 3.3.3. Conectividad de base de datos con PHP es muy importante, ya que de
aquí depende la construcción de las bases de datos para el sitio web. Una vez que se
cuente con el formulario de PHP, se hará la conectividad con la base de datos.
En el subtema 3.3.4. Inserción, consulta, edición y eliminación de registro, verás la forma
cómo se juega o se gestionan las bases de datos, esto facilitará la administración de las
mismas en tu sitio web, así como la accesibilidad por parte del usuario.
3.3.1. Tipos de base de datos
Es muy importante tener claro que las bases de datos pueden clasificarse de varias
formas, y se utilizan de acuerdo con las necesidades que sean solicitadas por el usuario, de
acuerdo a la variabilidad de los datos que se requieran almacenar en los mismos. De tal
forma que exista la posibilidad de utilizar cualquier tipo de base de datos de acuerdo con
los requerimientos del sitio web a desarrollar.
Existen dos tipos de bases de datos:
Estática. Es primordial para almacenar datos pasados. Sólo es lectura. Quiere decir que no
permite hacer modificaciones (Spona, 2010).
Dinámica. Como su nombre lo indica es dinámica, quiere decir que se pueden realizar
modificaciones, actualizaciones, realizar consultas y estar jugando con las bases de datos,
claro está, de acuerdo con las necesidades de la empresa. En la actualidad, es la más
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 45
usada. Un ejemplo de una base de datos es el de carrito de compras, que permite hacer,
modificar y cancelar las compras (Spona, 2010).
Un punto importante de esta base de datos dinámica consiste en que tiene un modelo de
base datos. Se define como modelo de base datos a la forma en que se guarda la
información en las bases de datos. A continuación se mencionan brevemente los tipos de
modelos de bases de datos dinámicas existentes:
• Modelo de base de datos jerárquicas. Como su nombre lo dice, se encarga de
almacenar la información en una estructura jerárquica. Esto quiere decir que es un
orden de elementos de acuerdo con su valor (Marín, Medina, Carrillo y Pons,
2008).
• Modelo de base de datos relacionales. Se encarga de administrar datos más
interactivos. Quiere decir que hay comunicación con diferentes tablas, ya sea de la
misma base de datos o de otras, lo cual hace que facilite la administración de las
base de datos. En la actulidad, este modelo es muy usado (Marín, Medina, Carrillo
y Pons, 2008).
• Modelo de base de datos red. Es la renovación del modelo jerárquico, ya que
ofrece una solución eficiente para la modificación de datos, por lo cual permite la
adminitración de la información.
A continuación, se muestra un esquema donde se exponen los modelos de base de datos
relacionales, red y jerárquico:
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 46
Ejemplo de modelo de base de datos. Fuente: Spona, 2010.
Modelo de base de datos documentales, este modelo permite que se almacene un texto
completo y permite realizarbúsquedas de forma más rápida (Marín, Medina, Carrillo y
Pons, 2008).
La importancia de conocer los tipos de base de datos permitirá identificar aquélla con que
se está trabajando o con la que se requiere trabajar, y así proponer soluciones para la
adminitración y creación de base de datos. Como ya se mencionó, la creación de una base
de datos debe ser adecuada a los requerimientos del sitio web de la empresa u
organización.
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 47
3.3.2. Instaladores de servidores web
En este subtema es muy importante tener conocimiento de la funcionalidad de los
servidores e instaladores de servidores web, los instaladores permiten utilizar el servidor
web Apache, mediante el cual es posible administrar, crear y conectar las bases de datos.
También permite administrar varios sitios web, como ya se hablado en la unidad 2, los dos
instaladores de servidor web más recomendados son AppServ y Xampp. La diferencia de
uno y otro es que Xampp tiene compatibilidad con el sistema operativo Linux, y AppServ
no.
Estos dos instaladores trabajan con el gestor de base de datos MYSQL, que permitirá crear
las bases de datos. Físicamente, cada nueva base de datos en MYSQL crea un directorio o
carpeta que contendrá los archivos. Lo que guarda la información son los objetos que
tiene almacenados (Beati, 2011).
La estructura de una tabla se define por la cantidad de campos en que se fraccione la
información que guarda. Los posibles campos se pueden imaginar como columnas de una
plantilla de cálculo para una tabla. Por ejemplo, se crea una tabla con el nombre de
producto. Sus campos serán el nombre del producto, descripción, categoría, precio,
etcétera. Por lo cual, se definirían como tipo de datos alfanuméricos y numéricos; también
se definirá la longitud de caracteres de cada campo.
Para consultar cómo se crean las bases de datos con los instaladores de servidor web
AppServ y Xampp, revisa el video Utilización de los instaladores de servidor web AppServ y
XAMPP.
Para consultar el recurso de video Utilización de los instaladores de servidor
web AppServ y XAMPP, da clic en la imagen de la derecha (es recomendable
que descargues el recurso para una mejor visualización).
http://youtu.be/gvBplyl7X8k
http://youtu.be/gvBplyl7X8k
http://youtu.be/gvBplyl7X8k
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 48
Como observaste en este video, la creación de las base de datos de las tablas son muy
fáciles de realizar. Es muy importante que tengas claro que así como declaraste el nombre
de los campos de las tablas, cuando vincules el formulario de PHP los nombres de los
campos del formulario sean iguales, para que no tengas problema alguno con la conexión
de la base de datos.
A continuación, en el siguiente subtema podrás visualizar cómo se vinculan las bases de
datos con PHP. Con esto podrás empezar a crear tus bases de datos de tu sitio web sin
problema alguno.
3.3.3. Conectividad de base de datos con PHP
Para vincular las bases de datos y las tablas que están dentro de las bases de datos en una
página web en PHP, debe haber una vinculación con el instalador del servidor web. Con la
ayuda del editor web podrás hacer la vinculación sin problema alguno aunque, como se
mencionó en el subtema anterior, tal como se declaran los nombres de los campos en el
instalador web debe de ser igual en PHP.
Observa los pasos para realizar la conectividad de base de datos con PHP en el siguiente
video Ejemplo de creación de conectividad de bases de datos con PHP.
Para consultar el recurso de video Ejemplo de creación de conectividad de
bases de datos con PHP, da clic en la imagen de la izquierda (es recomendable
que descargues el recurso para una mejor visualización).
Como puedes observar en el video, los pasos para hacer la conectividad de base de datos
con PHP son muy sencillos; por lo tanto, para complementar tu construcción de sitio web
con la bases de datos no tendrás problema alguno. En el siguiente subtema se explicarán
los pasos que posibilitan jugar con las bases de datos.
http://youtu.be/6PgEEd8Bq_I
http://youtu.be/6PgEEd8Bq_I
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 49
3.3.4. Inserción, consulta, edición y eliminación de registros
Una vez comprendida la forma en que se hace la conexión de las bases de datos con el
instalador web y con el lenguaje de programación PHP, es muy importante saber cómo se
puede jugar con las bases de datos en la página web. Con jugar con las bases de datos se
hace referencia a las funcionalidades de gestión de información tales como inserción,
consulta, edición y eliminación de registros. Esto facilita que no se necesite entrar
directamente al instalador web para hacer modificaciones a los registros que se estén
ingresando por los usuarios que están navegando en el sitio web.
Para observar cómo se crea la inserción y la consulta de registros en una página web,
revisa el siguiente video Inserción y consulta de registros en una página web
Para consultar el recurso de video Inserción y consulta de registros en
una página web, da clic en la imagen de la derecha (es recomendable
que descargues el recurso para una mejor visualización).
Para observar cómo se crea la edición y la eliminación de registros en una página web,
observa el video Editar y eliminar registros de una página web (UnADM, 2014b; basado en
Beati, 2011):
Para consultar el recurso de video Editar y eliminar registros de una
página web, da clic en la imagen de la izquierda (es recomendable que
descargues el recurso para una mejor visualización).
En el video mencionado anteriormente, se muestra el procedimiento para hacer ediciones
y eliminaciones en los registros, lo que permite la gestión de los datos o información. Cabe
mencionar que, una vez elaboradas las bases de datos y la construcción de las páginas
web, dependiendo de si el sitio sólo será vía Intranet o por Internet. Si es por Intranet sólo
se podrá visualizar por el nombre del dominio o por dirección IP, pero si es por vía
Internet se necesitará de un software donde permita levantar el sitio web completo, sin
problema alguno. Lo único que pedirá este software es el nombre del dominio y la
contraseña que da el proveedor, quien renta el espacio en Internet. El software
http://youtu.be/Dj13q5O9jvI
http://youtu.be/PIoKga77CAY
http://youtu.be/Dj13q5O9jvI
http://youtu.be/PIoKga77CAY
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 50
recomendado es CuteFTP, aplicación para la transferencia de archivos por FTP. Es un
software cuya licencia se tiene que adquirir, pero también te permite utilizar una versión
de pruebas por 30 días.
Cierre de la unidad
En esta unidad aprendiste y visualizaste la estructura de JavaScript. Observaste que en
JavaScript se necesita trabajar con HTML para así poder interactuar con su código;
además, JavaScript permite obtener páginas web más interactivas y realizar diferentes
acciones, claro está, dependiendo de las necesidades y requerimientos que se deban
considerar para la elaboración del sitio web; así como la creatividad del programador web.
También se mencionó que JavaScript y PHP pueden trabajar juntos, con lo cual es posible
integrar funcionalidades de gestión de información en una página web con conexión a
bases de datos. Respecto al lenguaje ASP, se expusieron las reglas de sintaxis y que trabaja
con el lenguaje Visual Basic Script y JavaScript mediante una sintaxis fija. ASP, al igual que
JavaScript, debe integrarse con el lenguaje de programación HTML, sólo que ASP trabaja
en forma más directa con el servidor web. Recuerda que ASP es una tecnología de
Microsoft, por lo cual se rige por ciertas reglas para trabajar en los sistemas operativos.
ASP trabaja con los servidores webIIS y Apache, y permite realizar plantillas propias de
sitios web, posibilita también utilizar esas plantillas para otro sitio web.
Se revisó brevemente lo que es una base de datos, en relación con la forma en que crean y
conectan a un sitio web, ya que en la actualidad es posible realizar este tipo de conexión
de sitios web a bases de datos. Se recordó que una base de datos es un paquete que
contiene toda la información necesaria para el funcionamiento de un sistema o un
proyecto completo. Una base de datos está compuesta por tablas, y las tablas por campos
que son el intermediario entre las bases de datos y las páginas, en las cuales se mostrarán
o se proporcionará eso datos que serán capaces de abrir la conexión, escribir, leer, editar,
etcétera, facilitando la interacción de información almacenada.
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 51
Para saber más
Si te interesa saber más sobre JavaScript, ingresa a los siguientes sitios:
• JavaScriptya. (s. f.). Disponible en
http://www.tutorialesprogramacionya.com/javascriptya/
• Librosweb. (s. f.). Disponible en http://librosweb.es/JavaScript/
Si te interesa saber más de objetos, funciones y métodos de JavaScript, visita el siguiente
sitio:
• Hscripts. (s. f.). Disponible en https://www.hscripts.com/es/
Si te interesa saber más de JavaScript y PHP acerca de la forma en que se conjugan, se
recomienda visitar el siguiente sitio:
Para saber más de ASP se recomienda el siguiente sitio web:
• Desarrolloweb (s. f.). Disponible en http://www.desarrolloweb.com/manuales/8/
• Aspya. (s. f.). https://www.tutorialesprogramacionya.com/aspya/
Si te interesa saber más de modelos de bases de datos, consulta los siguientes
documentos:
• Arcos Muñoz, V., Escribano Santamaría, A., López Utrilla, S., Peña Gallego, R., Susín
Martínez, S., Utrilla.
• Rosa Rosario, M. G. (s.f). Disponible en
https://es.slideshare.net/22carlos/modelos-de-basesdedatos
• Si deseas saber más sobre aplicación de bases de datos en otras áreas consulta los
siguientes documentos:
http://www.tutorialesprogramacionya.com/javascriptya/
http://librosweb.es/javascript/
https://www.hscripts.com/es/
http://www.desarrolloweb.com/manuales/8/
https://www.tutorialesprogramacionya.com/aspya/
https://es.slideshare.net/22carlos/modelos-de-basesdedatos
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 52
• Origel Gutiérrez, S. (2006). Recuperado de
http://www.revista.unam.mx/vol.7/num8/art68/int68.htm
• https://tinyurl.com/y8thgnl2
• Hernández Cervantes, L., Santillán González, A., y González-Ponce, A.R. (2009).
Recuperado de http://www.revista.unam.mx/vol.10/num10/art62/int62-3.htm
Si te interesa saber más sobre bases de datos, consulta el siguiente sitio donde
encontrarás algunos tutoriales sobre la conexión a bases de datos:
• Aulaclic. (s. f.). Recuperado de http://www.aulaclic.es/dreamweaver-
cs4/b_19_1_1.htm
Fuentes de consulta
• Beati, H. (2011). PHP de creación de páginas web. México: Alfaomega.
• Brito, N. (2009). Manual de desarrollo web con Grails. Madrid: Imaginaworks.
• Goodman, D. (2007). JavaScript Biblie. Indianapolis: Wiley Publishing.
• Gutiérrez, E. (2009). Recursos informáticos JavaScript. Conceptos básicos y
avanzados. Barcelona: Ediciones ENI
http://www.revista.unam.mx/vol.7/num8/art68/int68.htm
https://tinyurl.com/y8thgnl2
http://www.revista.unam.mx/vol.10/num10/art62/int62-3.htm
http://www.aulaclic.es/dreamweaver-cs4/b_19_1_1.htm
http://www.aulaclic.es/dreamweaver-cs4/b_19_1_1.htm
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 53
• Marín, N. Medina, J. Carrillo y S. Pons, O. (2008). Introducción a las bases de datos.
Madrid. Paraninfo
• Meloni, J. (2009). PHP, MySQL y Apache. Madrid: Anaya Multimedia.
• Orós, J. C. (2011). Diseño de páginas web con XHTML, JavaScript y CSS, 3a. ed.
México: Alfaomega.
• Remoaldo, P. (2008). Guia prático do Dreamweaver CS3 con PHP, JavaScript e Ajax.
Lisboa: Centro Atlántico.
• Sánchez Maza, M. A. (2001). JavaScript. Málaga: IC Innovación y Cualificación, S.L.
• Spona, H. (2010). Programación de bases de datos con MySQL y PHP. México:
Alfaomega/Marcombo.
• Valenzuela, V. (s. f.). Curso práctico de ASP.
• Vara Mesa, J. M., López Sanz, M., Granada, D., Irrazábal, E., Jiménez Hernández, J.
J., Verde Marín, J.. (2012). Guía didáctica del profesor de Desarrollo web en
entornos servidor. Madrid: Ra-Ma.
• Wenz, C., Rennhaus, C. y Kordwing, A. (2001). ASP: Active Server Pages.
Programación fácil de páginas web dinámicas. Barcelona: Marcombo.
Videografía:
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 54
• UnADM. Universidad Abierta y a Distancia de México. (2014a). Condición IF en
JavaScript y HTML [Archivo de video]. YouTube. http://youtu.be/liXxmeeoAfQ
• (2014b). Editar y eliminar registros de una página web [Archivo de video].
YouTube. http://youtu.be/PIoKga77CAY
• (2014c). Ejemplo de aplicación de código con el evento onMouseOver [Archivo de
video]. YouTube. http://youtu.be/COkm2Y8tzik
• (2014d). Ejemplo de aplicación de ficheros externos con JavaScript [Archivo de
video]. YouTube. http://youtu.be/lI-CFPW34u4
• (2014e). Ejemplo de combinación de JavaScript con PHP [Archivo de video].
YouTube. http://youtu.be/uCo8SpIL31Y
• (2014f). Ejemplo de creación de conectividad de bases de datos con PHP [Archivo
de video]. YouTube. http://youtu.be/6PgEEd8Bq_I
• (2014g). Ejemplo de aplicación del evento window.print() y explicación de su
funcionalidad [Archivo de video]. YouTube. http://youtu.be/ErgcHXosLqk
• (2014h). Ejemplo de aplicación del método de Alert [Archivo de video]. YouTube.
http://youtu.be/PwLPCNNxLzU
• (2014i). Ejemplo de aplicación del evento onClick y explicación de su
funcionamiento [Archivo de video]. YouTube. http://youtu.be/SzqQa8LT68E
http://youtu.be/liXxmeeoAfQ
http://youtu.be/PIoKga77CAY
http://youtu.be/COkm2Y8tzik
http://youtu.be/lI-CFPW34u4
http://youtu.be/uCo8SpIL31Y
http://youtu.be/6PgEEd8Bq_I
http://youtu.be/ErgcHXosLqk
http://youtu.be/PwLPCNNxLzU
http://youtu.be/SzqQa8LT68E
Unidad 3. Desarrollo de sitios web
UNADM | DCEIT | DS | DPW1 55
• (2014j). Inserción y consulta de registros en una página web [Archivo de video].
YouTube. http://youtu.be/Dj13q5O9jvI
• (2014k). Utilización de los instaladores de servidor web AppServ y XAMPP [Archivo
de video]. YouTube. http://youtu.be/gvBplyl7X8k
http://youtu.be/Dj13q5O9jvI
http://youtu.be/gvBplyl7X8k