1
resposta

Minha página não está funcionando 100%

Fiz o código de acordo com os vídeos e não identifiquei nenhum erro, mas quando eu verifiquei o resultado, minha página não funcionou devidamente. 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">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css" integrity="sha512-NmLkDIU1C/C88wi324HBc+S2kLhi08PN5GDeUVVVC/BVt/9Izdsc9SVeVfA1UZbY3sHUlDSyRXhCzHfr6hmPPw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" integrity="sha512-iecdLmaskl7CVkqkXNQ/ZH/XLlvWZOJyj7Yy7tcenmpD1ypASozpmT/E0iPtmFIB46ZmdtAc9eNBvH0H/ZpiBw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
    <link rel="stylesheet" href="style.css">
    <title>Número Secreto</title>
</head>
<body>
    <h1>Acerte o número secreto</h1>

    <h3>O número secreto está entre <span id="menor-valor">0</span> e <span id="maior-valor">100</span>></h3>

    <div id="chute" class="mensagem"></div>
        <!-- <div>Você disse:</div>
        <span class="box">20</span>
        <div>O número secreto é maior<i class="fa-solid fa-arrow-up-long"></i> </div> -->
        <script src="app/sortearNumero.js"></script>
        <script src="app/reconhecimentoDeVoz.js"></script>
</body>
</html>

JS:

const menorValor = 1
const maiorValor = 100

const numeroSecreto = gerarNumeroAleatorio()

function gerarNumeroAleatorio() {
    return parseInt(Math.round() * maiorValor + 1)
}

console.log("Número secreto:", numeroSecreto)

const elementoMenorValor = document.getElementById('menor-valor')
elementoMenorValor.innerHTML = menorValor
const elementoMaiorValor = document.getElementById('maior-valor')
elementoMaiorValor.innerHTML = maiorValor

e:

const menorValor = 1
const maiorValor = 100

const numeroSecreto = gerarNumeroAleatorio()

function gerarNumeroAleatorio() {
    return parseInt(Math.round() * maiorValor + 1)
}

console.log("Número secreto:", numeroSecreto)

const elementoMenorValor = document.getElementById('menor-valor')
elementoMenorValor.innerHTML = menorValor
const elementoMaiorValor = document.getElementById('maior-valor')
elementoMaiorValor.innerHTML = maiorValor
1 resposta

Olá Pedro, tudo bem?

Se possível, compartilhe o link do seu projeto conosco, seja via Github, codepen ou upado no Drive, dessa forma posso te auxiliar de forma mais assertiva.

Pelo código que você postou, não consegui identificar o problema exato que está acontecendo na sua página. Você poderia me dar mais informações sobre o que não está funcionando corretamente? Que parte não está funcionando? Aparece alguma mensagem de erro?

Um empecilho que pode estar causando problema é na sua função gerarNumeroAleatorio() que o cálculo do número aleatório está sendo substituído pela função Math.round:

function gerarNumeroAleatorio() {
    return parseInt(Math.round() * maiorValor + 1)
}

Mudando para Math.random o calculo será aleatório:

function gerarNumeroAleatorio() {
    return parseInt(Math.random() * maiorValor + 1)
}

De qualquer forma, uma sugestão que eu tenho é verificar se os arquivos "sortearNumero.js" e "reconhecimentoDeVoz.js" estão sendo carregados corretamente no seu código HTML. Verifique também se não há nenhum erro de digitação ou de lógica no seu código JavaScript.

Fico à disposição.

Um bom dia e bons estudos!