Scribd
Cargar
148 vistas7 páginas

Guia Lab 07 - Ing - Web - Javascript PDF

Este documento presenta una guía de laboratorio sobre eventos en JavaScript. Propone 10 ejercicios prácticos para codificar eventos como prompt, alert, onload, onclick, onmouseover, entre otros. Instruye a los estudiantes a crear carpetas y archivos PHP para cada ejercicio, y les indica presentar los avances al docente para su calificación.

Cargado por

Linda Sagitario Calderon Arevalo
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
148 vistas7 páginas

Guia Lab 07 - Ing - Web - Javascript PDF

Este documento presenta una guía de laboratorio sobre eventos en JavaScript. Propone 10 ejercicios prácticos para codificar eventos como prompt, alert, onload, onclick, onmouseover, entre otros. Instruye a los estudiantes a crear carpetas y archivos PHP para cada ejercicio, y les indica presentar los avances al docente para su calificación.

Cargado por

Linda Sagitario Calderon Arevalo
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
Está en la página 1/ 7

GUIA DE LABORATORIO Nº 7

Escuela Profesional: Ingeniería de Sistemas. Asignatura: Ingeniería Web.


Ciclo y Turno: Sexto - Tarde-Noche Semestre Académico: 2017 - I
Docente: Ing. Víctor Quevedo Dioses Fecha: 17/06/17

Sesión 07: Eventos en JavaScript

INTRODUCCION
En JavaScript, la interacción con el usuario se consigue mediante la captura de los eventos que éste
produce. Un evento es una acción del usuario ante la cual puede realizarse algún proceso (por ejemplo, el
cambio del valor de un formulario, o la pulsación de un enlace).

I. OBJETIVOS
Codificar y ejecutar los ejercicios de aplicación con Listas, Tablas, Enlaces, Hiperenlaces usando
HTML y

II. EQUIPOS Y MATERIALES


 Computadora personal.
 Programa con Notepad++ correctamente instalado
 Manual de HTML, donde están los ejercicios resueltos en código.

III. METODOLOGIA Y ACTIVIDADES

a) Codificar los ejercicios mostrados en esta guía


b) Presentar avances y ejecución de cada uno de los ejercicios al docente o jefe de práctica
encargado para la calificación correspondiente.
c) Guardar la carpeta de sus archivos a sus memorias.
d) Apagar el computador y dejarla en buen estado al retirarse del laboratorio dejar todo en
orden.

IV. INDICACIONES

 Antes de comenzar la Pagina Web crear siempre, una carpeta, donde se guardarán todas
las páginas web realizadas por usted en el presente laboratorio con el nombre
Web_Apellidos_Guia04 dentro de esta carpeta crear las carpetas imágenes.
 La presentación es personal y en el Laboratorio

Página 1 de 7
Practica Dirigida
Crear los siguientes ejercicios
Ejercicio1.php
<html>
<body>
<script type="text/javascript">
var nombre=prompt('Escriba su nombre:', ' ');
document.write('Hola '+nombre+' ¿COMO ESTAS?');
</script>
</body>
</html>

Ejercicio2.php

<html>
<head>
<script type="text/javascript">
function elinput(){
var una_variable = prompt("Digita tu nombre: ");
alert("Gusto en conocerte "+una_variable);
}
</script>
</head>
<body OnLoad="elinput();">
</body>
</html>

Página 2 de 7
Ejercicio3.php
alert
<html>
<head>
<script language="javascript">
var cadena="Esto es una mensaje en
javascript";
alert(cadena)
</script>
</head>
</html>

Ejercicio4.php
onLoad –Unload

<html>
<head>
<script
language=javascript>
function carga(){
alert("Cargando....");
}
function termina(){
alert("Carga terminada....");
}
</script>
</head>
<body onLoad="carga()"
onUnload="termina()">
Hola Mundo...
</body>
</html>
Ejercicio5.php

OnLoad
<html> <head>
<script language="javascript">
function entrada(){
alert("Cargando") }
</script>
</head>
<body onLoad="entrada()">
Hola a todos
</body></html>

Página 3 de 7
Ejercicio6.php

onClick-onFocus-onKeyPress
<html>
<head>
<script>
function pulsa()
{
alert("Autor:Victor Enrique Quevedo Dioses");
}
function foco()
{
alert("foco en la primera capa");
}
function tecla()
{
alert("Pulsada tecla");
}
</script>
</head>
<body>
<input type="button" value="Autor" onClick="pulsa();">
<input type="text" size="S" onFocus="foco();">
<input type="text" size="S" onKeyPress="tecla();">
</body>
</html>
Ejercicio7.php
onMouseOver
<html>
<head>
<script>
function pasa(valor){
if (valor==1)
img.src="linux.gif"
else
img.src="mapa.gif"
}
</script>
</head>
<body>
<img name="img" src="php.gif"
onMouseOver="pasa(1)" onMouseOut="pasa(2)">
</body>
</html>

Ejercicio8.php
Objeto Window

Página 4 de 7
<HTML>
<HEAD>
<TITLE>Objeto Window</TITLE>
<SCRIPT LANGUAGE
="JavaScript">
<!-- se oculta la información de los
navegadores antiguos

function abrirVentana(){
var miVentana;
miVentana=open("","miVentana","menubar=0,width=250,height=150,top=100,left=100");

miVentana.document.write("<HTML>");
miVentana.document.write("<HEAD>");
miVentana.document.write("<TITLE>Nuevo objeto Window</TITLE>");
miVentana.document.write("</HEAD>");
miVentana.document.write("<BODY>");
miVentana.document.write("<CENTER>");
miVentana.document.write("<H3>Esta nueva ventana llamada '");
miVentana.document.write(miVentana.name);
miVentana.document.write(" ' se cerrará al pulsar el botón...<BR>");
miVentana.document.write("<FORM>");
miVentana.document.write('<INPUT TYPE=BUTTON VALUE="Cerrar"
onClick="self.close()">');
miVentana.document.write("</FORM>")
miVentana.document.write("</CENTER>");
miVentana.document.write("</BODY>");
miVentana.document.write("</HTML>");
}

// final del comentario -->


</SCRIPT>
</HEAD>
<BODY>
<CENTER>
<H2>Manejando el objeto window...</H2>
<FORM NAME="miFormulario">
<INPUT TYPE=BUTTON NAME="miBoton" VALUE="Púlsame" onClick="abrirVentana()">
</FORM>
</CENTER>
</BODY>
</HTML>

Página 5 de 7
Ejercicio9.php
Imprimir los números del 1 al 10

<html>
<body>
NUMEROS DE 1 A 10<BR>
<script type="text/javascript">
var i;
for (i=1; i<=10; i++) {
document.write(i+'<br>');
}
</script>
</body>
</html>

Ejercicio10.php

Haga una Página web que genere una pirámide de 1 a 50, formada de la siguiente forma:
<html>
<body> 1
<script type="text/javascript"> 12
var i,j; 123
for (i=1; i<=50; i++) { 1234
for (j=1; j<=i; j++) { 12345
document.write(j); 123456
} 1234567
document.write('<br>'); 12345678
} 123456789
</script> 12345678910
</body> 1234567891011
</html> ...

Ejercicios propuestos
1.- Crear un programa en javascript que muestre 5 imágenes se debe mostrar al inicio,
otra imagen cuando se pasa encima, otra imagen cuando se retira de la imagen y
cuando se pulsa la tecla enter
2.- Crear un programa en javascript que muestre una ventana emergente conteniendo
una imagen, en esta ventana debe haber un botón que muestra otra ventana con
textos
3.-Crear un programa en donde se ingresa el nombre y debe validar con javascript que
solo se ingrese letras, cuando se ingresa debe validad que solo ingrese numero y
cuando se ingresa el correo debe detectar si ha ingresado el @ y el punto(-)

Página 6 de 7
Página 7 de 7

También podría gustarte