Unidad Educativa Fiscal Dr. Arturo Freire
Proyecto Interdisciplinario 2do Trimestre
Programación y Base de Datos
Tema: Blog Escolar de la Asignatura de Programación y Base de Datos
Nombre: Anderson Aucay.
Curso: Segundo Informática "B".
martes, 11 de marzo de 2025
martes, 4 de marzo de 2025
Uso de la función prompt para el registro de empleados
La siguiente página utilizará la función prompt() para permitir el ingreso de datos sobre empleados y sus sueldos en vectores y darnos una lista con los datos ingresados.
Código:
<html>
<head>
<title>Ejercicio de vectores </title>
<script language="javascript" type="text/javascript">
// VECTORES CON ENTRADA DE DATOS
var empleado= new Array(10);
var sueldo= new Array(10);
var n=3;
for(var i=0;i<n;i++)
{
empleado[i]= prompt(" Ingrese Nombre del Empleado: ");
sueldo[i]= prompt("Ingrese Sueldo");
}
document.write("contenido de vectores </br>");
document.write("Empleado - Sueldo </br>");
for(i=0;i<n;i++)
{
document.write(empleado[i] + " - " + sueldo[i] + "</br>");
}
</script>
</head>
<body bgcolor=lightgreen>
</body>
</html>
Funcionalidad de la Página:
Uso de las funciones de texto para la validación de strings
La siguiente página demostrará la verificación de un texto y una serie de números eliminando caracteres especiales o desubicados en cada uno.
Código:
<html>
<head>
<title>
Eliminación Caracteres
</title>
</head>
<body bgcolor=lightgreen>
<form name="form1" method="post" action="">
<center><b><h1>PÁGINA - ELIMINACIÓN CARACTERES ESPECIALES</h1></b>
Ingrese País:
<input type="text" name="pais" id="pais"><p>
Resultado:
<input type="text" name="resultado" id="resultado"><p>
Cédula:
<input type="text" name="cedula" id="cedula"><p>
Resultado:
<input type="text" name="Resultado" id="Resultado"><p>
<input type="button" value="Procesar" Onclick="Procesar()">
</center>
</form>
</body>
<script>
function Procesar()
{
var v_texto = document.getElementById("pais").value;
var v_num = document.getElementById("cedula").value;
var n = v_texto.length;
var m = v_num.length;
res = "";
resd = "";
for(i=0;i<n;i++)
{
c=v_texto.charAt(i);
if(c>="A"&&c<="Z")
{
res = res+c;
}
if(c>="a"&&c<="z")
{
res = res+c;
}
if(c==" ")
{
break;
}
}
for(j=0;j<m;j++)
{
d=v_num.charAt(j);
if(d>="0"&&d<="9")
{
resd = resd + d;
}
}
resultado.value=res;
Resultado.value=resd;
}
</script>
</html>
Funcionalidad de la Página:
Uso de la condicional if para el conteo individual de las letras N-M-Ñ
La siguiente página realizará un conteo de las consonantes N, M y Ñ devolviéndole al usuario la cantidad existente de cada una de manera individual.
Código:
<html>
<head>
<title>Contar NMÑ</title>
</head>
<script>
function procesar()
{
var v_texto = document.getElementById("texto").value;
n = v_texto.length;
var totaln = 0;
var totalm = 0;
var totalñ = 0;
var sw = 0;
for(i=0;i<n;i++)
{
c = v_texto.charAt(i);
if(c=="n")
{
totaln++;
sw++;
}
if(c=="m")
{
totalm++;
sw++;
}
if(c=="ñ")
{
totalñ++;
sw++;
}
if(c=="N")
{
totaln++;
sw++;
}
if(c=="M")
{
totalm++;
sw++;
}
if(c=="Ñ")
{
totalñ++;
sw++;
}
numn.value=totaln;
numm.value=totalm;
numñ.value=totalñ;
}
if(sw==0)
{
alert("No existen letras n, m ó ñ");
}
}
</script>
<body bgcolor=lightgreen>
<h1><b><center>PROGRAMA CONTAR LETRAS N - M - Ñ</h1></b></center><p>
<center>Ingrese Texto:
<input type="text" name="texto" id="texto"><p>
Número de Letras N:
<input type="text" name="na" id="numn"><p>
Número de Letras M:
<input type="text" name="ne" id="numm"><p>
Número de Letras Ñ:
<input type="text" name="ni" id="numñ"><p>
<input type="button" value="Procesar" Onclick="procesar()"></center>
</body>
</html>
Funcionalidad de la Página:
Uso de vectores para el registro de destinos y precios
La siguiente página utiliza la búsqueda de vectores prealmacenados en un contexto de aerolíneas, destinos y precios donde se muestra una lista de los precios de las distintas aerolíneas hacia el destino deseado además de realizar una comparación de precios en busca del más económico.
Código:
<html>
<script>
function procesar()
{
var destinos=['España','Rusia','Italia','Chile','México'];
var p_latamairlines=[200,125,350,100,160];
var p_qatarairways=[150,190,250,750,150];
var p_iberia=[175,175,200,170,175];
var v_nom=document.getElementById("nombre").value;
var n=5;
var suma=0;
document.write ("MANEJO DE VECTORES <br/>");
document.write ("VUELOS Y PRECIOS <br/>");
for(i=0;i<n;i++)
{
document.write(destinos[i] + " - ");
document.write(p_latamairlines[i] + "$" + " - " );
document.write(p_qatarairways[i] + "$" + " - " );
document.write(p_iberia[i] + "$" + "<br/>" );
}
var sw=0;
var n=5;
for(i=0;i<n;i++)
{
if(v_nom==destinos[i])
{
document.write("Producto: " + destinos[i] + "<br/>");
document.write("Precio Latam Airlines: " + p_latamairlines[i] + "$" + "<br/>");
document.write("Precio Qatar Airways: " + p_qatarairways[i] + "$" + "<br/>");
document.write("Precio Iberia: " + p_iberia[i] + "$" );
sw=1;
var j = i;
}
}
if(sw==0)
{
alert("Destino no encontrado");
}
var p_barato = 0;
if(p_latamairlines[j]<p_qatarairways[j])
{
p_barato = p_latamairlines[j];
}
else
{
p_barato = p_qatarairlines[j];
}
if(p_iberia[j]<p_barato)
{
p_barato = p_iberia[j];
}
document.write("<br/>" + "Precio Más Económico: " + p_barato);
}
</script>
<head>
<title>Búsqueda de Precio</title>
<meta charset="UTF-8">
</head>
<body bgcolor=lightgreen>
<h2>Búsqueda de Datos en Vector<h2><p>
<form name="form1" method="post" action="">
Nombre: <input type="text" name="Nombre:" id="nombre"><p>
<input type="button" onclick="procesar()" value="Procesar"><p>
</form>
</body>
</html>
Funcionalidad de la Página:
Uso de la estructura de control switch para la traducción de números al italiano
La siguiente página contiene una modificación a la página de los números en inglés siendo que en este caso traduce los números al italiano.
Código:
<html>
<head>
<title>Números Italiano</title>
</head>
<script>
function procesar()
{
var v_num = document.getElementById("Numero").value;
switch(v_num)
{
case "1":
Resultado.value="Uno";
break;
case "2":
Resultado.value="Due";
break;
case "3":
Resultado.value="Tre";
break;
case "4":
Resultado.value="Quattro";
break;
case "5":
Resultado.value="Cinque";
break;
case "6":
Resultado.value="Sei";
break;
case "7":
Resultado.value="Sette";
break;
case "8":
Resultado.value="Otto";
break;
case "9":
Resultado.value="Nove";
break;
case "10":
Resultado.value="Deci";
break;
default:
alert("Número no registrado");
break;
}
}
</script>
<body bgcolor=lightgreen>
<b><h2>PROGRAMA NÚMEROS EN ITALIANO</b></h2><p>
Ingrese un Número del 1 al 10:
<input type="text" name="Numero" id="Numero"><p>
Resultado en Italiano:
<input type="text" name="Resultado" id="Resultado"><p>
<input type="button" value="Procesar" Onclick="procesar()">
</body>
</html>
Funcionalidad de la Página:
Uso de la función de texto length para el conteo de caracteres de un texto
La siguiente página utiliza la función de length para contar el número de caracteres que el usuario ingrese y devolverle el número.
Código:
<html>
<script>
function calcular()
{
var v_texto = document.getElementById("texto").value;
var v_resultado = document.getElementById("resultado").value;
n = v_texto.length;
document.getElementById("resultado").value=n;
}
</script>
<body bgcolor=lightgreen>
<form name="form1" method="post" action="">
<center>
<h2>FUNCIONES TEXTO - CONTAR CARACTERES</h2>
<h3>
TEXTO:
<input type="text" name="texto" id="texto"><p>
RESULTADO:
<input type="text" name="resultado" id="resultado" placeholder="Resultado"><p>
<input type="button" onclick="calcular()" name="r" id="r" value="Procesar"><p>
</h3>
</center>
</form>
</body>
</html>
Funcionalidad de la Página:
Uso de la estructura de control switch y la condicional if para la traducción de números a letras de un cheque
La siguiente página utiliza el mismo método que la página de traducción de números a letras con el contexto de una página que convierte una cantidad de un cheque que va desde 1$ hasta los 9999$ para su fácil comprensión.
Código:
<html>
<head>
<title>
PÁGINA CHEQUE
</title>
</head>
<body bgcolor=lightgreen>
<h1><center><b>PÁGINA TRADUCCIÓN CHEQUE</h1></center></b><p>
<b><center>Ingrese Cantidad del Cheque (1$ - 9999$):
<input type="text" name="numero" id="numero"><p>
Resultado Traducido:
<input type="text" name="resultado" id="resultado"><p>
<input type="button" value="Procesar" Onclick="Procesar()"></b></center>
</body>
<script>
function Procesar()
{
var v_num = document.getElementById("numero").value;
n = v_num.length;
numi = "";
res = "";
for(i=n-1;i>=0;i--)
{
c = v_num.charAt(i);
if(c >= "0"&& c <= "9")
{
numi = numi + c;
}
}
u = numi.charAt(0);
switch(u)
{
case "1":
res = "uno" + res;
break;
case "2":
res = "dos" + res;
break;
case "3":
res = "tres" + res;
break;
case "4":
res = "cuatro" + res;
break;
case "5":
res = "cinco" + res;
break;
case "6":
res = "seis" + res;
break;
case "7":
res = "siete" + res;
break;
case "8":
res = "ocho" + res;
break;
case "9":
res = "nueve" + res;
break;
}
d = numi.charAt(1);
switch(d)
{
case "1":
res = "diez y " + res;
break;
case "2":
res = "veinti" + res;
break;
case "3":
res = "treinta y " + res;
break;
case "4":
res = "cuarenta y " + res;
break;
case "5":
res = "cincuenta y " + res;
break;
case "6":
res = "sesenta y " + res;
break;
case "7":
res = "setenta y " + res;
break;
case "8":
res = "ochenta y " + res;
break;
case "9":
res = "novena y " + res;
break;
}
c = numi.charAt(2);
switch(c)
{
case "1":
res = "cien " + res;
break;
case "2":
res = "doscientos " + res;
break;
case "3":
res = "trescientos " + res;
break;
case "4":
res = "cuatrocientos " + res;
break;
case "5":
res = "quinientos " + res;
break;
case "6":
res = "seiscientos " + res;
break;
case "7":
res = "setecientos " + res;
break;
case "8":
res = "ochocientos " + res;
break;
case "9":
res = "novecientos " + res;
break;
}
um = numi.charAt(3);
switch(um)
{
case "1":
res = "mil " + res;
break;
case "2":
res = "dos mil " + res;
break;
case "3":
res = "tres mil " + res;
break;
case "4":
res = "cuatro mil " + res;
break;
case "5":
res = "cinco mil " + res;
break;
case "6":
res = "seis mil " + res;
break;
case "7":
res = "siete mil " + res;
break;
case "8":
res = "ocho mil " + res;
break;
case "9":
res = "nueve mil " + res;
break;
}
resultado.value = res;
}
</script>
</html>
Funcionalidad de la Página:
Uso de vectores y la función prompt para el registro de precio y destino
Mediante la siguiente página se enseñará el ingreso de información a los vectores mediante una pestaña que solicita ingresar datos los cuales almacena en su vector asignado y despliega la lista de datos guardados.
Código:
<html>
<head>
<title>Ejercicio de vectores </title>
<script language="javascript" type="text/javascript">
// VECTORES CON ENTRADA DE DATOS
var destino= new Array(10);
var precio= new Array(10);
var n=3;
for(var i=0;i<n;i++)
{
destino[i]= prompt(" Ingrese destino: ");
precio[i]= prompt("Ingrese precio");
}
document.write("contenido de vectores </br>");
document.write("destino - PRECIO </br>");
for(i=0;i<n;i++)
{
document.write(destino[i] + " - " + precio[i] + "</br>");
}
</script>
</head>
<body>
</body>
</html>
Funcionalidad de la Página:
Uso de vectores y algoritmos de comparación para la búsqueda de precios
En la siguiente página se desplegará una lista de precios y frutas de diferentes supermercados junto a una función que compara el precio del producto seleccionado en todos los supermercados y te da el más económico junto al nombre del supermercado al que pertenece.
Código:
<html>
<script>
function procesar()
{
var frutas=['Papaya','Mango','Cereza','Achotillo','Guayaba'];
var p_supermaxi=[2,1.25,3.50,1,1];
var p_aki=[1.50,1,2.50,0.75,1.50];
var p_santamaria=[1.75,0.75,2,1,1.75];
var v_nom=document.getElementById("nombre").value;
var n=5;
var suma=0;
document.write ("MANEJO DE VECTORES <br/>");
document.write ("FRUTAS Y PRECIOS <br/>");
for(i=0;i<n;i++)
{
document.write(frutas[i] + " - ");
document.write(p_supermaxi[i] + "$" + " - " );
document.write(p_aki[i] + "$" + " - " );
document.write(p_santamaria[i] + "$" + "<br/>" );
}
var sw=0;
var n=5;
for(i=0;i<n;i++)
{
if(v_nom==frutas[i])
{
document.write("Producto: " + frutas[i] + "<br/>");
document.write("Precio Supermaxi: " + p_supermaxi[i] + "$" + "<br/>");
document.write("Precio Aki: " + p_aki[i] + "$" + "<br/>");
document.write("Precio Santa Maria: " + p_santamaria[i] + "$" );
sw=1;
var j = i;
}
}
if(sw==0)
{
alert("Producto no encontrado");
}
var p_barato = 0;
if(p_supermaxi[j]<p_aki[j])
{
p_barato = p_supermaxi[j];
}
else
{
p_barato = p_aki[j];
}
if(p_santamaria[j]<p_barato)
{
p_barato = p_santamaria[j];
}
document.write("<br/>" + "Precio Más Económico: " + p_barato);
}
</script>
<head>
<title>Búsqueda de Precio</title>
<meta charset="UTF-8">
</head>
<body bgcolor=lightgreen>
<h2>Búsqueda de Datos en Vector<h2><p>
<form name="form1" method="post" action="">
Nombre: <input type="text" name="Nombre:" id="nombre"><p>
<input type="button" onclick="procesar()" value="Procesar"><p>
</form>
</body>
</html>
Funcionalidad de la Página:
Index
Una página index en HTML es el archivo principal de un sitio web, generalmente llamado index.html. Es la primera página que se carga cuando alguien accede a un dominio (por ejemplo, www.tusitio.com).
¿Por qué se llama index.html?
Función de la página index
- Sirve como la portada del sitio: Es lo primero que ven los visitantes.
- Organiza la navegación: Suele contener enlaces a otras secciones del sitio.
- Facilita el SEO: Es clave para la indexación en motores de búsqueda.
Ejemplo básico de un index.html
<html lang="es"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Mi Página de Inicio</title></head><body> <h1>Bienvenidos a mi sitio web</h1> <p>Explora nuestro contenido utilizando el menú.</p> <a href="about.html">Sobre nosotros</a></body></html>Los servidores web, como Apache o Nginx, están configurados para buscar un archivo llamado index.html o index.php como la página predeterminada. Si no lo encuentran, pueden mostrar una lista de archivos o un error.
Si colocas este archivo en la carpeta raíz de tu servidor, será lo primero que cargará el navegador al entrar en tu dominio.
Suscribirse a:
Entradas (Atom)