1
resposta

[Dúvida] Inserir imagem quando o if for true

Oi pessoal, estou treinando o uso do if e estou batendo cabeça pra conseguir inserir uma imagem quando o valor for true. Alguém pode me ajudar?

Meu código está assim:

var showsRJ = parseInt(prompt("Quantos shows a 1D fez no Rio de Janeiro?"));
var showsSP = parseInt(prompt("Quantos shows a 1D fez em São Paulo?"));

var shows = showsRJ + showsSP;
mostra("A quantidade shows é: " + shows);


if(shows > 10) {
    mostra("A 1D ama o Brasil");
}


if(shows < 10) { 
    mostra("A 1D odeia o Brasil");
}

A intenção é adicionar uma imagem nos dois if

1 resposta

Olá Aluno. Para conseguir adicionar uma imagem você vai precisar utilizar uma tag html. pois o javascript nos browsers por questões de segurança não permitem renderizar uma imagem porém após umas pesquisas encontrei o seguinte link com um código publico para essa funcionalidade. https://github.com/adriancooney/console.image

Porém voltando a uma solução da qual você consiga executar sem ter que utilizar códigos de terceiros segue o trecho de código:

//Html
<html>
    <head></head>
    <body>
        <img id="imagem" />
    </body>
</html>
//Javascript
<script type="text/javascript">
        function mostra(qtdShows, imagem)
        {
            console.log("A quantidade shows é: " + qtdShows)
            document.getElementById("imagem").src = imagem //variável imagem tem que ter o caminho inteiro ou estar no mesmo diretório
        }
        function iniciaQuiz()
        {
            var showsRJ = parseInt(prompt("Quantos shows a 1D fez no Rio de Janeiro?"));
            var showsSP = parseInt(prompt("Quantos shows a 1D fez em São Paulo?"));

            var shows = showsRJ + showsSP;


            if(shows > 10) {
                mostra("A 1D ama o Brasil", imagem1);//imagem1 é o caminho da imagem que você desejar
            }


            if(shows < 10) { 
                mostra("A 1D odeia o Brasil", image2);//imagem2 é o caminho da imagem que você desejar
            }
    }

    iniciaQuiz();
</script>

Não cheguei a testar o código mas é basicamente isso que da pra fazer sem biblioteca