Condições (Parte 2) – Curso JavaScript #12



Você sabe mudar a cor de fundo de um site, dinamicamente, usando JavaScript? Sabe como inserir uma imagem usando …

35 Comments

  1. gente tentei transformar o js dos dias da semana pra html porem sempre q coloco pra correr no site aparece o dia em forma de numero n sie como resolver isso pekpekse alguem me da uma luz ai
    <script>

    function clicar (){

    var res = window.document.querySelector('div#res')

    var agora = new Date()

    var dia = agora.getDay()

    switch (dia){

    case 0:

    console.log('Domingo')

    break

    case 1:

    console.log('Segunda')

    break

    case 2:

    console.log('Terça')

    break

    case 3:

    console.log('Quarta')

    break

    case 4:

    console.log('Quinta')

    break

    case 5:

    console.log('Sexta')

    break

    case 6:

    console.log('sabado')

    break

    default:

    }

    res.innerHTML = (`hoje é ${dia}`)

    }

    </script>

  2. // Mostra a hora e dia do sistema dessa forma:

    //Já são x horas da noite do dia x.

    var hora = 26

    var dia = 1

    if (hora > 24) {
    // conheço while do curso de Python, então digitei para saber se era igual, e então adicionei.
    while (hora > 24) {

    hora -= 24

    dia += 1

    }

    }

    if (hora < 12) {

    if (hora >= 6) {

    momento_do_dia = 'manha'

    } else {

    momento_do_dia = 'madrugada'

    }

    } else if (hora <= 18) {

    momento_do_dia = 'tarde'

    } else if (hora <= 24) {

    momento_do_dia = 'noite'

    }

    console.log(`Já são ${hora} horas da ${momento_do_dia} do dia ${dia}.`)

  3. ex012 – 20.09.22

    var hora = 23

    console.log(`agora são exatamente ${hora} horas.`)

    if (hora >= 0 && hora < 6) {

    console.log('Boa Madrugada!')

    } else if (hora < 12) {

    console.log('Bom Dia!')

    } else if (hora <= 18) {

    console.log('Boa Tarde!')

    } else if (hora <= 23) {

    console.log('Boa Noite!')

    }

  4. juntei com a aula sobre condição e fiz um script que mostra a data e hora, dando bom dia, boa noite, conforme a hora:

    var agora = new Date()

    var diaSem = agora.getDay()

    var hora = agora.getHours()

    if(hora >= 0 && hora <= 6){

    var horaAtual = "boa madrugada!"

    }else if(hora < 12){

    var horaAtual= "bom dia!"

    }else if(hora < 18){

    var horaAtual = "boa tarde!"

    }else{

    var horaAtual = "boa noite"

    }

    switch(diaSem){

    case 0:

    var diaSem = "Domingo"

    break

    case 1:

    var diaSem = "Segunda"

    break

    case 2:

    var diaSem = "Terça"

    break

    case 3:

    var diaSem = "Quarta"

    break

    case 4:

    var diaSem = "Quinta"

    break

    case 5:

    var diaSem = "Sexta"

    break

    default:

    var diaSem = "Sábado"

    }

    console.log(`Olá, agora são exatamente: ${hora} horas de ${diaSem}, ${horaAtual}`)

  5. Se passou curso todo mostrando algo simples de Java essas contas medianas , no final não mostrou nada de inovador só fez a pessoa perde tempo baixando essas ferramentas

  6. var agora = new Date()

    var horas = agora.getHours()

    console.log(`Agora sao exatamente ${horas} horas.`)

    if (horas >=0 && horas <6 ) {

    console.log('boa madrugada')

    } else if (horas <= 12 ) {

    console.log('boa dia!')

    } else if (horas <= 18){

    console.log('boa tarde!')

    } else if (horas <= 23){

    console.log('boa noite')

    }

  7. Quem tem chromebook samsung. Depois de instalar através do terminal do vscode o node js, para utilzar o "Node exec" que para mim apareceu "Node.js"(ano 2022), para executar a extenção, basta ir no menu acima e clicar em > Executar >> iniciar depuração ou Executar sem depuração, pois o chromebook não tem F8 no teclado.

    Espero ter ajudado pessoas como eu que estão iniciando do zero e tem um chromebook samsung.

  8. var agora = new Date()

    var diaSem = agora.getDay()

    var agora2 = new Date()

    var hora = agora.getHours()

    switch(diaSem){

    case 0:

    console.log('Domingo')

    if (hora < 5){

    console.log(`Hoje é Domingo! São exatamente ${hora} horas da madrugada.`)

    } else if (hora < 12){

    console.log(`Hoje é Domingo! São exatamente ${hora} horas da manhã.`)

    } else if (hora === 12){

    console.log(`Hoje é Domingo! São exatamente ${hora} horas do meio dia.`)

    } else if (hora < 18){

    console.log(`Hoje é Domingo! São exatamente ${hora} horas da tarde.`)

    } else {

    console.log(`Hoje é Domingo! São exatamente ${hora} horas da noite.`)

    }

    break

    case 1:

    console.log('Segunda')

    if (hora < 5){

    console.log(`Hoje é Segunda! São exatamente ${hora} horas da madrugada.`)

    } else if (hora < 12){

    console.log(`Hoje é Segunda! São exatamente ${hora} horas da manhã.`)

    } else if (hora === 12){

    console.log(`Hoje é Segunda! São exatamente ${hora} horas do meio dia.`)

    } else if (hora < 18){

    console.log(`Hoje é Segunda! São exatamente ${hora} horas da tarde.`)

    } else {

    console.log(`Hoje é Segunda! São exatamente ${hora} horas da noite.`)

    }

    break

    case 2:

    console.log('Terça')

    if (hora < 5){

    console.log(`Hoje é Terça! São exatamente ${hora} horas da madrugada.`)

    } else if (hora < 12){

    console.log(`Hoje é Terça! São exatamente ${hora} horas da manhã.`)

    } else if (hora === 12){

    console.log(`Hoje é Terça! São exatamente ${hora} horas do meio dia.`)

    } else if (hora < 18){

    console.log(`Hoje é Terça! São exatamente ${hora} horas da tarde.`)

    } else {

    console.log(`Hoje é Terça! São exatamente ${hora} horas da noite.`)

    }

    break

    case 3:

    console.log('Quarta')

    if (hora < 5){

    console.log(`Hoje é Quarta! São exatamente ${hora} horas da madrugada.`)

    } else if (hora < 12){

    console.log(`Hoje é Quarta! São exatamente ${hora} horas da manhã.`)

    } else if (hora === 12){

    console.log(`Hoje é Quarta! São exatamente ${hora} horas do meio dia.`)

    } else if (hora < 18){

    console.log(`Hoje é Quarta! São exatamente ${hora} horas da tarde.`)

    } else {

    console.log(`Hoje é Quarta! São exatamente ${hora} horas da noite.`)

    }

    break

    case 4:

    console.log('Quinta')

    if (hora < 5){

    console.log(`Hoje é Quinta! São exatamente ${hora} horas da madrugada.`)

    } else if (hora < 12){

    console.log(`Hoje é Quinta! São exatamente ${hora} horas da manhã.`)

    } else if (hora === 12){

    console.log(`Hoje é Quinta! São exatamente ${hora} horas do meio dia.`)

    } else if (hora < 18){

    console.log(`Hoje é Quinta! São exatamente ${hora} horas da tarde.`)

    } else {

    console.log(`Hoje é Quinta! São exatamente ${hora} horas da noite.`)

    }

    break

    case 5:

    if (hora < 5){

    console.log(`Hoje é Sexta! São exatamente ${hora} horas da madrugada.`)

    } else if (hora < 12){

    console.log(`Hoje é Sexta! São exatamente ${hora} horas da manhã.`)

    } else if (hora === 12){

    console.log(`Hoje é Sexta! São exatamente ${hora} horas do meio dia.`)

    } else if (hora < 18){

    console.log(`Hoje é Sexta! São exatamente ${hora} horas da tarde.`)

    } else {

    console.log(`Hoje é Sexta! São exatamente ${hora} horas da noite.`)

    }

    break

    case 6:

    console.log('Sábado')

    if (hora < 5){

    console.log(`Hoje é Sábado! São exatamente ${hora} horas da madrugada.`)

    } else if (hora < 12){

    console.log(`Hoje é Sábado! São exatamente ${hora} horas da manhã.`)

    } else if (hora === 12){

    console.log(`Hoje é Sábado! São exatamente ${hora} horas do meio dia.`)

    } else if (hora < 18){

    console.log(`Hoje é Sábado! São exatamente ${hora} horas da tarde.`)

    } else {

    console.log(`Hoje é Sábado! São exatamente ${hora} horas da noite.`)

    }

    break

    default:

    console.log('[ERRO]: Dia inválido!')

    break

    }

  9. /* COM BASE NAS ULTIMAS AULAS , UMA PLATAFORMA ONDE VOCÊ INFORMA SEU NOME E IDADE E ELE TE CUMPRIMENTA INFORMAndo QUAL DIA DA SEMANA VOCÊ ESTÁ E DEPENDENDO DA HORA TE DA BOA TARDE , BOA NOITE , OU BOM DIA , não foi usado css*

    <!DOCTYPE html>

    <html lang="pt-BR">

    <head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

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

    <title>Hora e Data</title>

    </head>

    <body>

    <h1> Nome e Idade</h1>

    <p><input id="nomec" type="text" placeholder="Digite Seu Nome"> <!– CAIXA DE TEXTO IDADE–>

    <p><input id="idadec" type="number" placeholder="Informe Sua Idade"> <!– CAIXA DE TEXTO IDADE–>

    <input type="button" value="Enviar" onclick="nomeidade(),dsemana(),hsemana()" ></p> <!– BOTÃO DE ENVIAR–>

    <div id="escrevaNatela">

    </div>

    <p id="daysemana">DIA DA SEMANA</p>

    <p id="hoursemana">HORA</p>

    <script>

    function nomeidade(){

    var respnome = window.document.getElementById('nomec')

    var respnome = (nomec.value)

    var respidade = window.document.getElementById('idadec')

    var escreva= window.document.getElementById('escrevaNatela')

    var respidade = (idadec.value)

    escreva.innerHTML = `Olá Sr(a).${respnome} você tem ${respidade} anos.`

    }

    function hsemana(){

    var hora = new Date()

    var atualhora = hora.getHours()

    var atualminuto = hora.getMinutes()

    var atualsegundos = hora.getSeconds()

    var escrevahora = window.document.getElementById('hoursemana')

    if(atualhora >=12 && atualhora <19){

    escrevahora.innerHTML = `Boa Tarde! São exatamente ${atualhora} Horas ${atualminuto} minutos e ${atualsegundos} segundos`

    } else if (atualhora >=19 && atualhora <=00){

    escrevahora.innerHTML = `Boa Noite! São exatamente ${atualhora} Horas ${atualminuto} minutos e ${atualsegundos} segundos`

    } else if (atualhora >=01 && atualhora <=04){

    escrevahora.innerHTML = `Boa Madrugada! São exatamente ${atualhora} Horas ${atualminuto} minutos e ${atualsegundos} segundos`

    }else {

    escrevahora.innerHTML = `Bom Dia! São exatamente ${atualhora} Horas ${atualminuto} minutos e ${atualsegundos} segundos`

    }

    }

    function dsemana(){

    var semana = new Date()

    var respsemana = semana.getDay()

    var escrevadia = window.document.getElementById('daysemana')

    switch (respsemana) {

    case 0:

    escrevadia.innerHTML = `Hoje é Domingo`

    break;

    case 1:

    escrevadia.innerHTML = `Hoje é Segunda-Feira`

    break;

    case 2:

    escrevadia.innerHTML = `Hoje é Terça-Feira`

    break;

    case 3:

    escrevadia.innerHTML = `Hoje é Quarta-Feira`

    break;

    case 4:

    escrevadia.innerHTML = `Hoje é Quinta-Feira`

    break;

    case 5:

    escrevadia.innerHTML = `Hoje é Sexta-Feira`

    break;

    case 6:

    escrevadia.innerHTML = `Hoje é Sabado`

    break;

    }

    }

    </script>

    </body>

    </html>

  10. Condição aninhada

    var usuario = 'Lucas'

    var agora = new Date()

    var hora = agora.getHours()

    var minuto = agora.getMinutes()

    console.log(

    `Olá ${usuario}! Agora são exatamente ${hora} horas e ${minuto} minutos`

    )

    if (hora < 6) {

    console.log('Boa madrugada')

    } else if (hora >= 6 && hora < 12) {

    console.log('Bom dia')

    } else if (hora <= 18) {

    console.log('Boa tarde')

    } else if (hora <= 24) {

    console.log('Boa noite')

    }

  11. Quando aperto F8 no meu Node.js ele sempre aparece:

    info: start process (hora)
    (resultado)
    info: end process (hora)

    Como tira isso? Esse 'info'. A tela fica meio poluída..

  12. Gente, no meu VSCode quando testos os códigos com a tecla F8 para aparecer no terminal embaixo, junto do resultado fica aparecendo "Info: Start process (hh:mm:ss)" e "info: End process (hh:mm:ss) como que tira essas informações pra ficar mais limpo quando eu testo os códigos, alguém pode ajudar?

  13. Primeiro ex, fiz uma modificada

    var peso = 59

    console.log(`Seu peso é de ${peso}`)

    if(peso < 60) {

    console.log('Voce passa fome')

    } else {

    if(peso < 80) {

    console.log('Voce esta na media')

    } else {

    console.log('Tu é muito pesado man')

    }

    }

  14. <!DOCTYPE html>

    <html lang="pt-br">

    <head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

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

    <title>PAISES</title>

    <style>

    body {

    background-color: antiquewhite;

    }

    h1 {

    color: rgb(226, 24, 24);

    text-transform: uppercase;

    text-align: center;

    }

    p {

    color: purple;

    text-transform: uppercase;

    text-align: center;

    }

    </style>

    </head>

    <body>

    <h1>ESTRANGEIROS E BRASILEIROS</h1>

    <p>Digite o pais na caxinha!!!</p>

    <p> Teste de EB: <input type="text" name="eb" id="eb">

    <input type="button" value="Verificar EB" onclick="analisar()">

    <div id="es"></div></p>

    <script>

    function analisar() {

    var txteb = window.document.querySelector('input#eb') // Tudo que a pessoa digitar no input, vai ficar guardado na "txteb"

    var txtdiv = window.document.querySelector('div#es')

    var escrito = (txteb.value) // vai pedir o valor que ta dentro do "txteb"

    if (escrito == 'Brasil' ) {

    txtdiv.innerHTML += ('Você é do brasil')

    } else {

    txtdiv.innerHTML += ('Você é estrangeiro')

    }

    }

    </script>

    </body>

    </html>
    OBS: usei o paragrafo para alinhar o input porque ainda não sei muito CSS3

  15. fiz considerando o alistamento militar, pq quando se serve o ano obrigatório você não vota @_@

    <!DOCTYPE html>

    <html lang="en">

    <head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

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

    <title>Vote</title>

    </head>

    <body>

    <h1>Do you need to vote?</h1>

    <p>put your age</p>

    <input type="number" name="age" id="age">

    <p>Compulsory military service</p>

    <select id="service">

    <option value="">Make your choice</option>

    <option value="serving">Serving</option>

    <option value="not_serving">Is not serving</option>

    <input type="button" value="Analyse" onclick="analyse()">

    <div id="res"></div>

    <script>

    function analyse() {

    var age = Number(document.querySelector('#age').value)

    var choice = document.querySelector('#service').value

    if (age < 16 || age == 18 && choice ==='serving') {

    alert(`You can't vote`)

    } else if (age < 18 || age >= 65){

    alert(`Your vote is optional`)

    } else {

    alert(`Your vote is mandatory`)

    }

    }

    </script>

    </body>

    </html>

  16. Meu código:

    <!DOCTYPE html>

    <html lang="pt-BR">

    <head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

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

    <title>Horário</title>

    <style>

    body{

    margin: 0px;

    }

    div#Base{

    background-color: bisque;

    height: 100vh;

    width: 100vw;

    display: flex;

    align-items: center;

    justify-content: center;

    }

    div#Janela{

    background-color: cadetblue;

    height: 300px;

    width: 300px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    }

    div#Resposta{

    margin-top: 20px;

    color: white;

    }

    p{

    color: cadetblue;

    }

    </style>

    </head>

    <body>

    <div id="Base">

    <div id="Janela">

    <button id="Botão" onclick="Clicar()">

    <p>Confirmar</p>

    </button>

    <div id="Resposta"></div>

    </div>

    </div>

    <script>

    function Clicar(){

    if(new Date().getHours() >= 12){

    document.getElementById("Resposta").innerText = `Agora são ${new Date().getHours()}:${new Date().getMinutes()}. Boas-tardes!`

    }else{

    if(new Date().getHours() < 12 && new date().getHours() >= 0){

    document.getElementById("Resposta").innerText = `Agora são ${new Date().getHours()}:${new Date().getMinutes()}. Bons-dias!`

    }else{

    document.getElementById("Resposta").innerHTML = `Agora são ${new Date().getHours()}:${new Date().getMinutes()}. Boas-noites!`

    }

    }

    }

    </script>

    </body>

    </html>

  17. Fala meu mestre! no exercicio 12 o meu ${hora} não fica azul igual ao seu de jeito nenhum, onde eu posso estar errando?

  18. let idade = 67

    if (idade < 18){

    if (idade < 16){

    console.log("Não vota")

    }else{

    if (idade >= 16){

    console.log("Voto não obrigatório")

    }

    }

    }else{

    if (idade >= 67){

    console.log("Voto não obrigatório")

    }else{

    console.log("Voto obrigatório")

    }

    }
    Essa lógica estaria certa correto? Fiz antes dele

  19. Pra quem tiver duvidas sobre o assunto de condições aninhadas. para o curso momentaneamente e vai pro curso de algoritmos dele. que você aprende tanto la que quando você voltar pra ca vai parecer brincadeirinha isso aqui

Leave a Reply

© 2023 53GB