I can not reduce the value of the html span

0

I am playing a guessing game with a number of attempts equal to 3. Whenever the user misses the kick, the number of attempts should fall, but this is not happening. Does anyone know what I'm missing ??

HTML

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Adivinhador</title>
</head>
<body>
<h1>Adivinhador</h1>
    <form name="adivinha" id="adivinha_form" action="#">
        <p>
            Seu chute: <br>
            <input type="text" id="chute" name="chute">
        </p>

        <button onclick="valida()" reset="true">Arriscar</button>

        <p>Tentativas: <span id="tentativa">3</span> </p>
    </form>
    <script type="text/javascript" src="adivinhacao.js"></script> <!-- Para converter valor de span no JS, chamar o innerText -->
</body>
</html>

JavaScript

var chute = document.getElementById("chute")
var tentativa = document.getElementById("tentativa")

function valida() {

    var chute2 = parseInt(chute.value)
    var tentativa2 = parseInt(tentativa.innerText)
    var numero = parseInt(1 + Math.random() * 10)
    if(chute2 >= 0 && chute2 <= 10) {
        aleatorio(numero, chute2, tentativa2)
    }
    else {
        alert("Favor digitar um numero de 0 a 10")
    }
}

function aleatorio(numero, chute2, tentativa2) {
    if (chute2 != numero) {
        alert("Você errou! Tente de novo")
        document.getElementById("adivinha_form").reset();
    }
    else if (chute2 != numero && tentativa2 == 2) {
        alert("Suas chances acabaram! O número correto é " + numero)
    }
    else if (chute2 == numero) {
        alert("Parabéns! Você acertou")
    }
}
    
asked by anonymous 24.04.2017 / 20:24

1 answer

2

var chute;
var tentativa;
var numero;
var i=1;
function valida() {

    chute = parseInt(document.getElementById("chute").value)
    tentativa = parseInt(document.getElementById("tentativa").textContent)
    numero = parseInt(1 + Math.random() * 10)
    if(chute >= 0 && chute <= 10) {
        aleatorio(numero, chute)
    }
    else {
        alert("Favor digitar um numero de 0 a 10")
    }
}

function aleatorio(numero, chute) {
    if ((chute != numero)&&(tentativa > 0)) {
        
        alert("Você errou! Tente de novo")
        
        document.getElementById("chute").value = "";
        
         var x = document.getElementById("tentativa").textContent;
         document.getElementById("tentativa").innerHTML = x-i;
        
    }
    else if (tentativa == 0) {
        alert("Suas chances acabaram! O número correto é " + numero);
        document.getElementById("adivinha_form").reset();
        document.getElementById("tentativa").innerHTML = 3;
        document.getElementById("chute").value = "";
        chute="";
        numero="";
        i=1;
        
    }
    else if (chute == numero) {
        alert("Parabéns! Você acertou");
        document.getElementById("adivinha_form").reset();
        document.getElementById("tentativa").innerHTML = 3;
        document.getElementById("chute").value = "";
        chute="";
        numero="";
        i=1;
    }

}
<form name="adivinha" id="adivinha_form" action="#" onsubmit="return false">
        <p>
            Seu chute: <br>
            <input type="text" id="chute" name="chute" value=""  autofocus>
        </p><br><br>

        <button onclick="valida()" reset="true">Arriscar</button>
        
        <p>Tentativas: <span id="tentativa">3</span> </p>
           
</form>
    
25.04.2017 / 00:19