Curso Nº2 Desafio Nº2
A solução de o desafio.
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Desafio Nº 2</title>
</head>
<body>
<header>
<h1></h1>
</header>
<main class="container">
<button onclick="olaMundo()" class="button">Olá, mundo!</button>
<button onclick="olaNome(nome)" class="button">Olá, [nome]!</button>
<button onclick="dobroNumero(numeroDobro)" class="button">Dobro do Número</button>
<button onclick="mediaNumero(numeroMedia1,numeroMedia2,numeroMedia3)" class="button">Média dos Numeros</button>
<button onclick="numeroMaior(numeroMaior1,numeroMaior2)" class="button">Maior dos Numeros</button>
<button onclick="quadradoDoNumero(numeroQuadrado)" class="button">Numero Quadrado</button>
</main>
<script src="app.js"></script>
</body>
</html>
style.css
header {
text-align: center;
font-size: 30px;
color: hwb(77 16% 0%);
}
main, html {
margin: 0;
padding: 0;
height: 50%;
display: flex;
justify-content: center;
align-items: center;
background-color: hsl(0, 92%, 14%);
}
.container {
text-align: center;
color: hwb(77 16% 0%);
}
.button {
padding: 10px 20px;
margin: 10px;
font-size: 24px;
border: none;
color: hsl(0, 92%, 20%);
background-color: hsl(124, 70%, 53%);
cursor: pointer;
border-radius: 20px;
}
.button:hover {
background-color: #057d11;
}
app.js
/* Curso de Logica de Programação 2 */
/* Desafio da Aula Nº 2 */
// Declaração e asignaçaõ de Variaveis //
let titulo = (document.querySelector('h1')).innerHTML = 'Hora do Desafio Nº 2';
let cumprimento = 'Olá, mundo!';
let nome = 'Richard';
let numeroDobro = 5;
let numeroMedia1 = 10;
let numeroMedia2 = 8;
let numeroMedia3 = 6;
let numeroMaior1 = 100;
let numeroMaior2 = 76;
let numeroQuadrado;
// Funções dos botôes//
function olaMundo() {
console.log(cumprimento);
alert(cumprimento);
}
function olaNome(nome) {
console.log(`Olá, ${nome}`);
alert(`Olá, ${nome}`);
}
function dobroNumero(numeroDobro) {
resultado = numeroDobro * 2;
console.log(`O dobro do ${numeroDobro} é ${resultado}`);
alert(`O dobro do ${numeroDobro} é ${resultado}`);
}
function mediaNumero(numeroMedia1,numeroMedia2,numeroMedia3) {
resultado = (numeroMedia1 + numeroMedia2 + numeroMedia3) / 3;
console.log(`A media dos números ${numeroMedia1} , ${numeroMedia2} e ${numeroMedia3}, é ${resultado}`);
alert(`A media dos números ${numeroMedia1} , ${numeroMedia2} e ${numeroMedia3}, é ${resultado}`);
}
function numeroMaior(numeroMaior1, numeroMaior2) {
if (numeroMaior1 > numeroMaior2) {
console.log(`Emtre os números ${numeroMaior1} e ${numeroMaior2}, o Número Maior é ${numeroMaior1}`);
alert(`Emtre os números ${numeroMaior1} e ${numeroMaior2}, o Número Maior é ${numeroMaior1}`);
} else if (numeroMaior2 > numeroMaior1){
console.log(`Emtre os números ${numeroMaior1} e ${numeroMaior2}, o Número Maior é ${numeroMaior2}`);
alert(`Emtre os números ${numeroMaior1} e ${numeroMaior2}, o Número Maior é ${numeroMaior2}`);
}
}
function quadradoDoNumero(numeroQuadrado) {
numeroQuadrado = prompt('Número a receber');
resultado = parseInt(numeroQuadrado) * parseInt(numeroQuadrado);
console.log(`O quadrado do ${numeroQuadrado} é ${resultado}`);
alert(`O quadrado do ${numeroQuadrado} é ${resultado}`);
}
