4395-Indovina numero by @DigitalTeacher - Codewith.it

#main, .loader-cont { display: none; } JavaScript disabilitato.
Non puoi usare Codewith.it senza JavaScript.

References

<ol>Crea liste ordinate o numerate.
loopL'attributo loop è usato per la riproduzione continua dei contenuti video e audio
<hr>Inserisce una linea orizzontale
srcsetL'attributo srcset definisce la risorsa grafica tramite URL all'interno del tag <source> contenuto in <picture>
<label>Mostrare un testo di etichetta per un elemento di input.
srcIndica la provenienza di una risorsa esterna (tramite URL).

Users

Log in to search for users

Explore

Find inspiration

Corrispondenza tra stringhe

esercitazione a cazzo a casa

Calcolatrice Pitagora

La cicala e la formica

Esercio-selettori-di-relazione

Esercizi 05/03/2024 es4

HTML

CSS

JS

terminal console

feedback

add_box New

cookie Policy

Privacy information and cookies

We use cookies or technologies for technical purposes and, with your consent, also for other purposes as specified in the cookie policy. Refusal of consent may make some functions unavailable. Read more about the privacy policy

Click on “Agree” to confirm.

<!DOCTYPE html>
<html>
  <head>
    <title>Indovina numero</title>
    <style>
      html 
      {
        font-family: sans-serif;
      }
      body 
      {
        width: 50%;
        max-width: 800px;
        min-width: 480px;
        margin: 0 auto;
      }
      .lastResult 
      {
        color: white;
        padding: 3px;
      }
    </style>
  </head>
  <body>
    <h1>Indovina numero</h1>

    <p>E' stato estratto un numero casuale compreso tra 1 e 100. Vedi se riesci a indovinarlo in 10 turni o meno. Ad ogni tentativo verra' indicata se il tuo tentativo è stata troppo alto o troppo basso.</p>

    <div class="form">
      <label for="guessField">Inserisci un valore: </label><input type="text" id="guessField" class="guessField">
      <input type="submit" value="Tentativo" class="guessSubmit">
    </div>

    <div class="resultParas">
      <p class="guesses"></p>
      <p class="lastResult"></p>
      <p class="lowOrHi"></p>
    </div>

<script>
  let randomNumber = Math.floor(Math.random() * 100) + 1;
  const guesses = document.querySelector('.guesses');
  const lastResult = document.querySelector('.lastResult');
  const lowOrHi = document.querySelector('.lowOrHi');
  const guessSubmit = document.querySelector('.guessSubmit');
  const guessField = document.querySelector('.guessField');
  let guessCount = 1;
  let resetButton;

  function checkGuess() {
    let userGuess = Number(guessField.value);
    if (guessCount === 1) {
      guesses.textContent = 'Precedenti tentativi: ';
    }

    guesses.textContent += userGuess + ' ';

    if (userGuess === randomNumber) {
      lastResult.textContent = 'Congratulazioni! Hai indovinato!';
      lastResult.style.backgroundColor = 'green';
      lowOrHi.textContent = '';
      setGameOver();
    } else if (guessCount === 10) {
      lastResult.textContent = '!!!GIOCO FINITO!!!';
      lowOrHi.textContent = '';
      setGameOver();
    } else {
      lastResult.textContent = 'Errato!';
      lastResult.style.backgroundColor = 'red';
      if(userGuess < randomNumber) {
        lowOrHi.textContent = "L'ultimo valore era piu' basso!" ;
      } else if(userGuess > randomNumber) {
        lowOrHi.textContent = "L'ultimo valore era piu' alto!";
      }
    }

    guessCount++;
    guessField.value = '';
    guessField.focus();
  }

  guessSubmit.addEventListener('click', checkGuess);

  function setGameOver() {
    guessField.disabled = true;
    guessSubmit.disabled = true;
    resetButton = document.createElement('button');
    resetButton.textContent = 'Inizia una nuova partita';
    document.body.appendChild(resetButton);
    resetButton.addEventListener('click', resetGame);
  }

  function resetGame() {
    guessCount = 1;
    const resetParas = document.querySelectorAll('.resultParas p');
    for(let i = 0 ; i < resetParas.length ; i++) {
      resetParas[i].textContent = '';
    }

    resetButton.parentNode.removeChild(resetButton);
    guessField.disabled = false;
    guessSubmit.disabled = false;
    guessField.value = '';
    guessField.focus();
    lastResult.style.backgroundColor = 'white';
    randomNumber = Math.floor(Math.random() * 100) + 1;
  }
</script>
  </body>
</html>

*{ }