Final
Permitir el registro de usuario y el perfil del administrador.
Se solicita a varias personas a responder una encuesta sobre el consumo de gaseosas.
1, Consume gaseosa
2, no consume gaseosa
Si la respuesta es afirmativa, mostrar las siguientes opciones:
1. Postobón
2. Coca Cola
3. Pool
4. Otra
Almacenar en una base de datos el número del documento del encuestado, el nombre, si consume o no gaseosa y de ser afirmativa la respuesta cuál consume.
En el perfil administrador, debe permitir visualizar los resultados de la encuesta.
Ejemplo 1
Leer 2 números y sumarlos. Paso por referencia
<!DOCTYPE html>
<html>
<head><meta charset="utf-8"/>
<title> Entrada de Datos</title>
<script>
function calcula(dato1, dato2)
{
const
resultado=parseFloat(dato1)+parseFloat(dato2);
salida.innerHTML = resultado
}
</script>
</head>
<body>
<form name="formu_datos">
Introduce número: <input type="text"
size="10" name="entrada1"/>
Introduce número: <input type="text"
size="10" name="entrada2"/>
<input type="button" value="Pulsa"
onclick="calcula(entrada1.value, entrada2.value)"
/>
</form>
<div id ="salida"></div>
</body>
</html>
Ejemplo 2
<html>
<head>
<title>Suma de 2 numeros</title>
<meta charset="utf-8">
<script type="text/javascript">
let numero1=prompt("Digite numero 1") ;
let numero2=prompt("Digite numero 2") ;
let resul=parseFloat(numero1)+parseFloat(numero2)
alert("El resultado es "+resul);
</script>
</head>
<body>
<p></p>
</body>
</html>
*******************************************
Calculadora
<html>
<head>
<meta charset="UTF-8">
<!-- Esto es el título de la página que usualmente aparece en la barra de título del navegador -->
<title>Calculadora</title>
</head>
<body style="text-align: center">
<div style="border: black 3px solid; height: 20rem; width: 30rem; margin: 8rem 25rem">
<h2 style="margin-top: 2.5rem">Calculadora básica</h2>
<label>Número 1: </label>
<input type="Text" name="campo1" id="campo1" value="" size="12"><br><br>
<label>Número 2: </label>
<input type="Text" name="campo2"id="campo2" value="" size="12"><br><br>
<button id="s">sumar</button>
<button id="r">restar</button>
<button id="m">multiplicar</button>
<button id="d">dividir</button>
<br><br>
<button id="resultado">resultado</button>
<output id='solucion'></output>
</div>
<script>
let op;
document.querySelector('#s').addEventListener('click', () =>{
op = '+';
});
document.querySelector('#r').addEventListener('click', () =>{
op = '-';
});
document.querySelector('#m').addEventListener('click', () =>{
op = '*';
});
document.querySelector('#d').addEventListener('click', () =>{
op = '/';
});
document.querySelector('#resultado').addEventListener('click', () =>{
let n1 = parseInt(document.querySelector('#campo1').value);
let n2 = parseInt(document.querySelector('#campo2').value);
console.log(n1);
console.log(n2);
let solucion;
if (op == "+") {
solucion = n1 + n2;
} else if (op == "-") {
solucion = n1 - n2;
} else if(op == "*"){
solucion = n1 * n2;
}else{
solucion = n1 / n2;
}
console.log(solucion);
document.querySelector('#solucion').innerHTML = solucion;
});
</script>
</body>
</html>
*******************************************
Comparar números
<html>
<head>
<meta charset="UTF-8">
<!-- Esto es el título de la página que usualmente aparece en la barra de título del navegador -->
<title>Números </title>
</head>
<body style="text-align: center">
<div style="border: black 3px solid; height: 20rem; width: 30rem; margin: 8rem 25rem">
<h2 style="margin-top: 2.5rem">Calculadora básica</h2>
<label>Número: </label>
<input type="Text" name="campo1" id="campo1" value="" size="12"><br><br>
<br><br>
<button id="resultado">Resultado</button>
<output id='solucion'></output>
</div>
<script>
document.querySelector('#resultado').addEventListener('click', () =>{
let n1 = parseInt(document.querySelector('#campo1').value);
console.log(n1);
let solucion;
if (n1 == "0") {
solucion = " Es cero";
} else if (n1 > "0") {
solucion = " Es positivo";
} else {
solucion = " Es Negativo";
}
console.log(solucion);
document.querySelector('#solucion').innerHTML = n1+solucion;
});
</script>
</body>
</html>
*******************************************
Actividad
1. Corrija el código JavaScript de estos dos ejercicios.
Ejercicio 1
<html>
<head>
<meta charset="UTF-8">
<!-- Esto es el título de la página que usualmente aparece en la barra de título del navegador -->
<title>Ángeles</title>
<script language ="JavaScript"
/Visualiza un mensaje de Bienvenida
alert (Bienvenido a mi página de ángeles)
</script>
</head>
<body>
<img src="D:\Pruebas\angel.jpg"/>
<p>Hola, esta es una página dedicada a los ángeles</p>
</body>
</html>
Ejercicio 2
<html>
<head>
<meta charset="utf-8">
<title>Ángeles</title>
<script type="text/javascript">
function mostrarMensaje1() {
var angel;
angel = prompt ('Por favor introduce nombre del angel:')
if (angel =="") { aler ('No has escrito el nombre de tu angel'); }
switc (angel) {
case "miguel": alert ("Tienes el angel de la protección"); break;
case "uriel": alert ("Tienes el angel de la prosperidad");
case rafael: alert ("Tienes el angel de la sanación"); break;
default: alert ("No es un angel"); break;
}
}
</script
</head>
<body>
<div>
<p>Aquí un párrafo de texto situado antes de la imagen, dentro de un div contenedor</p>
<img onclick="mostrarMensaje1()" src="angel.jpg" alt="Angel" title="Angel, un útil editor de texto">
<p onclick ="alert('Alerta JavaScript')" style="color: #D2691E;">Aquí otro párrafo de texto. JavaScript es un lenguaje utilizado para dotar de efectos dinámicos a las páginas web.
</p>
</div>
</body>
</html>
2. Complete el código con las instrucciones faltantes.
(edad > 1 && < 9)
{
alert (‘Eres un niño‘);
Else
{
(‘Eres un Adolescente’);
}
<head>
</head>
<body>
<script language="JavaScript">
var nombre='Pedro';
var edad=15;
var altura=1.81;
var casado=false;
document.write(nombre);
document.write('<br>'); document.write(edad);
document.write('<br>'); document.write(altura);
document.write('<br>'); document.write(casado);
</script>
</body>
</html>
<head>
<script language="JavaScript">
var valor1;
var valor2;
valor1=prompt('Ingrese primer número:','');
valor2=prompt('Ingrese segundo número','');
var suma=parseInt(valor1)+parseInt(valor2);
var producto=valor1*valor2;
document.write('La suma es '); document.write(suma);
document.write('<br>'); document.write('El producto es ');
document.write(producto);
</script>
</head>
<body>
</body>
</html>
<!DOCTYPE html>
<html lang="es">
<head>
<meta
charset="UTF-8">
<title>Números Aleatorios</title>
</head>
<body>
<h1>Generador de 5 Números Aleatorios</h1>
<ul
id="numeros"></ul>
<script>
const
listaNumeros = document.getElementById("numeros");
let numero
= Math.floor(Math.random() * 100) + 1;
let li =
document.createElement("li");
li.textContent = numero;
listaNumeros.appendChild(li);
}
</script>
</body>
</html>
*******************************************
Leer 3 números
<!DOCTYPE html>
<html lang="es">
<head>
<meta
charset="UTF-8">
<title>Leer
Tres Números </title>
</head>
<body>
<h1>Introduce
tres números</h1>
<form
id="form">
<button
type="submit">Enviar</button>
</form>
<div
id="result"></div>
<script>
document.getElementById("form").addEventListener("submit",
function(event) {
event.preventDefault();
let numbers =
[];
let i = 0;
let validInput =
true;
while
(numbers.length < 3) {
let input =
prompt(`Introduce el número ${numbers.length + 1}:`);
let number =
parseInt(input);
if
(!isNaN(number)) {
numbers.push(number);
} else {
alert("Por favor, ingresa un número válido.");
}
i++;
}
});
</script>
</body>
</html>
No hay comentarios.:
Publicar un comentario