Jump to content
alecram28

Exercicio Javascript switch case

Recommended Posts

Bom dia.

Tenho o seguinte exercicio para fazer, comecei a fazer mas nao consigo terminar e nao sei se é bem isso. 

Se alguem puder me ajudar, sou iniciante. Obrigado!

 

Questao: Usando HTML, CSS e JS, escreva um algoritmo que leia o código de uma operação a partir o teclado e que realize a operação associada a esse código. O código é um valor inteiro. Os códigos
e operações são listados abaixo:
1 Área de um retângulo. Os valores da base e da altura do retângulo devem ser informados pelo usuário. OBS: aretângulo = base * altura.
2 Área de um triângulo. Os valores da base e da altura do triângulo devem ser informados pelo usuário. OBS: atriângulo = (base * altura) / 2.
3 Área de um círculo. O valor do raio do círculo deve ser informado pelo usuário. OBS: acírculo = 3,14 * (raio)2

4 Área de um trapézio. Os valores da base maior, da base menor e da altura do trapézio devem ser informados pelo usuário. OBS: atrapézio = [(base maior + base menor) * altura] / 2.

 

 

 

Meu código:

html:

 

<!DOCTYPE html>

<html lang="pt-br">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Área figuras</title>

<link rel="stylesheet" href="pratica06exercicio04.css">

<script src="pratica06exercicio04.js" type="text/javascript"></script>

</head>

<body>

<main>

<h1>Área de Figuras Geométricas</h1>

<h3>Informe o número da operação desejada:</h3>

<h4>1- Área Retângulo<br>2-Área Triângulo<br>3-Área Círculo<br>4-Área Trapézio</h4>

<div class="numero">Código <input type="number"id="cod"></div>

<button onclick="codigo()">OK</button>

<div id="operandos"></div>

<div id="resultado"></div>

</main>

</body>

</html>

 

 

 

 

js:

 

function codigo() {

var c = document.getElementById("cod");

switch (c) {

case '1':

operandosRetangulo()

break;

case '2':

operandosTriangulo()

break;

case '3':

operandosCirculo()

break;

case '4':

operandosTrapezio()

break;

 

}

}

 

function limparTela() {

var operandos = document.getElementById("operandos");

var resultado = document.getElementById("resultado");

operandos.style.display = "none";

resultado.style.display = "none";

}

 

function operandosCirculo() {

limparTela();

var operandos = document.getElementById("operandos");

operandos.innerHTML = "Informe o raio: <input type='number' id='raio'>" +

"<br/>" + "<button onclick='areaCirculo ()'>OK</button>";

operandos.style.display = "block";

}


 

function operandosRetangulo() {

limparTela();

var operandos = document.getElementById("operandos");

operandos.innerHTML = "Informe a base: <input type='number' id='base'>" +

"<br/>" +

 

"Informe a altura: <input type='number'id='altura'>" +

"<br/>" +

"<button onclick='areaRetangulo ()'>OK</button>";

operandos.style.display = "block";

}

 

function operandosTriangulo() {

limparTela();

var operandos = document.getElementById("operandos");

operandos.innerHTML = "Informe a base: <input type='number' id='baset'>" +

"<br/>" +

 

"Informe a altura: <input type='number'id='alturat'>" +

"<br/>" +

"<button onclick='areaTriangulo ()'>OK</button>";

operandos.style.display = "block";

}

 

function operandosTrapezio() {

limparTela();

var operandos = document.getElementById("operandos");

operandos.innerHTML = "Informe a base maior: <input type='number' id='basema'>" +

"<br/>" +

"Informe a base menor: <input type='number' id='baseme'>" +

"<br/>" +

 

"Informe a altura: <input type='number'id='alturaz'>" +

"<br/>" +

"<button onclick='areaTrapezio ()'>OK</button>";

operandos.style.display = "block";

}


 

function areaCirculo() {

var raioSTR = document.getElementById("raio").value;

var raio = parseFloat(raioSTR);

var area = 3.14 * Math.pow(raio, 2);

var resultado = document.getElementById("resultado");

resultado.innerHTML = area;

resultado.style.display = "block";

}


 

function areaRetangulo() {

var baseSTR = document.getElementById("base").value;

var alturaSTR = document.getElementById("altura").value;

var base = parseFloat(baseSTR);

var altura = parseFloat(alturaSTR);

var area = base * altura;

var resultado = document.getElementById("resultado");

resultado.innerHTML = area;

resultado.style.display = "block";

}

 

function areaTriangulo() {

var bt = document.getElementById("baset").value;

var at = document.getElementById("alturat").value;

var baset = parseFloat(bt);

var alturat = parseFloat(at);

var areat = (bt * at) / 2;

resultado.innerHTML = areat;

resultado.style.display = "block";

}

 

function areaTrapezio() {

var bma = document.getElementById("basema").value;

var bme = document.getElementById("baseme").value;

var az = document.getElementById("alturaz").value;

var areatra = ((bma + bme) * az) / 2;

resultado.innerHTML = areatra;

resultado.style.display = "block";

 

}


 

 

 

 

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By srs1999_
      Tópico
       
      Site em Código
      Sobre desenvolver sites sem o wordpress que ja tá tudo ali feito que seja um site dinâmico ou seja com banco de dados , APIs de pagamento, Painel para o usuário ,  além de todas  as funções que tem no wordpress e você teria propriedade pra explicar sobre detalhes mais técnicos da produção onde no wordpress só quem entende de progrqmação explicaria algum detalhe técnico 
      Então usando basicamente : 
      FRONT END 
      HTML 
       CSS 
      JAVASCRIPT 
      ALGUMA DE BACKEND COMO PHP E BANCO DE DADOS
      Pode se criar sites/sistemas tão bons ou melhores que no wordpress
       
      Fato : o proprio wordpress é feito em php e ate o proprio facebook tbm em php
      Fato 2 :  cerca de 70% dos sites são feitos em Wordpress
       
      Acho esse lance de procurar o caminho mais fácil limita muito a pessoa por exemplo é facil editar imagens no paint bem intuitivo , agora para editar no photoshop com muitas outras possibilidades  acaba sendo importante ir explorando essa elaboração mais difícil  com um mesmo objetivo. No caso do exemplo ( editar imagens )  
       
      Reflexão:
      Vale a pena se dedicar a trabalhar com a ferramenta Wordpress apenas por ser um meio rápido de ganhar dinheiro ?
      Ou trabalhar sem wordpress  usando tudo que exigido pra criar coisas originais mais que não seria tão rápido a produção. Mas creio que além dos sites feitos também geraria a possibildade de vender o sistema web criado para o cliente personalizar .
       
      Você Desenvolveria de que forma :
       Wordpress apenas ?
       
      Conhecer programação pra trabalhar 
      com  Wordpress ?
       
      Produzir tudo só com programação totalmente dinâmico sem  Wordpress?
    • By Joob
      Boas Malta,
       
      Queria ver se me conseguiam ajudar.
      Tenho um Search Bar em Vue,  quando faço uma pesquisa dos ficheiros ou pastas, dá-me sempre como se nada fosse encontrado, ou seja não dá o resultado, imaginemos por exemplo a pasta tem um nome de "Pasta Numero" eu começava a pesquisar com "P" ou com o "N" e supostamente deveria pesquisar tudo o que tem "P" e "N" (pastas e ficheiros).
       
      Resolvido
       
      Obrigado :)
    • By zuuzu
      Olá, estou desenvolvendo uma api para download de fotos/videos/gif, eu consegui fazer tudo certinho, mas na hora de gerar um link de download aleatório ele gera sempre o mesmo, só gera um link diferente se eu reiniciar o servidor, queria que gerasse um link diferente sempre que eu reiniciasse a página, sem precisar reiniciar o servidor. Tem como alguém me ajudar com isso? *A api está sendo desenvolvida para a automatização de download de fotos/videos/gif*

    • By mateus.andriollo
      Boa tarde,
      Tenho alguns campos numéricos q ao fazer uma select gostaria q retornasse uma legenda
       
      exemplo:
      Status: 0=Inativo / 1=Ativo Condição: 1=Funcionando / 2=Em manutenção / 3=Manutenção Interna   
      Seria algo assim, tenho varias tabelas com estes campos... mas tenho q ficar usando replace.
      Existe uma forma de criar uma função para isso? Nem q na função eu tenha que setar nome do campo, ficando assim:
      Legenda('Status',cadastro.status) 
    • By Felper
      Estou tentando alterar a cor de fundo de uma célula, porém está dando o seguinte erro: Uncaught TypeError: Cannot read property 'style' of null .
      Segue abaixo o meu código:
       
      function criarTabela(){ // vamos criar o elemento HTML table var tabela = document.createElement("table"); tabela.border = "1px"; tabela.cellSpacing = "0px"; tabela.cellPadding = "3px"; // vamos criar o corpo da tabela, ou seja, o tbody var corpo = document.createElement("tbody"); tabela.appendChild(corpo); // vamos criar três linhas contendo quatro células cada uma for(var i = 0; i < 151; i++){ var linha = corpo.insertRow(-1); for(var j = 0; j < 5; j++){ var celula = linha.insertCell(-1); celula.setAttribute("id", "lin"+i+"col"+j); } } // vamos anexar a tabela recém-criada a um elemento div var container = document.getElementById("container"); container.appendChild(tabela); } cria.addEventListener('click', criarTabela); let lin1col0 = document.getElementById('lin1col0'); let lin2col0 = document.getElementById('lin2col0'); let lin3col0 = document.getElementById('lin3col0'); let lin4col0 = document.getElementById('lin4col0'); let lin5col0 = document.getElementById('lin5col0'); let num = 1; switch(num){ case 1: lin1col0.style.backgroundColor = "red"; break; case 2: lin2col0.style.backgroundColor ="red"; break; case 3: lin3col0.style.backgroundColor = "red"; break; case 4: lin4col0.style.backgroundColor = "red"; break; case 5: lin5col0.style.backgroundColor = "red"; break; default: alert("Erro!"); }  
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.