Como criar perguntas com respostas exatas e não aleatórias?

const elementoResposta = document.querySelector('#resposta') const inputPergunta = document.querySelector('#inputPergunta') var respostas = [ 'Segure com o dedo na figurinha do WhatsApp e depois clique em remover', 'Clique na Play Store, depois digite na parte superior o nome do Aplicativo que você quer baixar', ] function fazerPergunta() { if(inputPergunta.value == 'Como excluir figurinhas do WhatsApp?' ) { var respostas = [0] return } const totalRespostas = respostas.length const numeroAleatorio = Math.floor(Math.random() * totalRespostas) elementoResposta.innerHTML = respostas[numeroAleatorio] setTimeout(function() { elementoResposta.style.opacity = 0 }, 5000) }

Oi, Rodrigo! Tudo certo?

Perdão pela demora em te dar um retorno.

Primeiramente, vamos aos códigos!

O HTML ficaria desta forma:

<input type='text' placeholder='Digite a pergunta:' id="inputPergunta" onchange='fazerPergunta()'/>

<p id="resposta"> </p>

E o JavaScript, assim:

const elementoResposta = document.querySelector('#resposta')
const inputPergunta = document.querySelector('#inputPergunta')

var respostas = ["Segure com o dedo na figurinha do WhatsApp e depois clique em remover", "Clique na Play Store, depois digite na parte superior o nome do Aplicativo que você quer baixar"]

function fazerPergunta() {
  if(inputPergunta.value == 'Como excluir figurinhas do WhatsApp?' ) {
    elementoResposta.innerHTML = respostas[0]
  }
}

Com o innerHTML nós conseguimos devolver o elementoResposta do array. Já o onchange fará uma ação após determinada mudança.

Fora isso, criamos um elemento "p" de parágrafo que está vazio a princípio e possui um "id" de identificação, mas que assim que a função fazerPergunta() for disparada, ele será preenchido. Juntos, eles ficam como mostrado acima no bloco de código do HTML: <p id="resposta"> </p>.

E, prontinho! Ao escrever a pergunta de exemplo, nosso programa retornará a resposta que queríamos.

Além disso, vou deixar como sugestão os seguintes cursos para se aprofundar em HTML e manipulação na DOM (Document Object Model, do inglês, Modelo de Documento por Objetos. Temos um artigo da Alura sobre o assunto!):

E vou deixar também uma formação de JavaScript para Front-End: JavaScript para Front-end

Caso as dúvidas persistirem, estamos à disposição. :)

Abraços e bons estudos!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado! ✓.