Simple HTML Guessing Game - Code & Tutorial - 常规

<html>
<head>
    <title>Guessing Game</title>
</head>
<body>
    <h1>Guessing Game</h1>
    <p>Guess a number between 1 and 10.</p>
    <input id='guess-input' type='number' min='1' max='10' />
    <button id='guess-button'>Guess</button>
    <div id='result'></div>
    <script>
        let secretNumber = Math.floor(Math.random() * 10) + 1;
        let guessInput = document.getElementById('guess-input');
        let guessButton = document.getElementById('guess-button');
        let resultDiv = document.getElementById('result');
<pre><code>    guessButton.addEventListener('click', checkGuess);

    function checkGuess() {
        let userGuess = Number(guessInput.value);
        if (secretNumber === userGuess) {
            resultDiv.innerHTML = 'You guessed it!';
        } else {
            resultDiv.innerHTML = 'Try again!';
        }
    }
&lt;/script&gt;
</code></pre>
</body>
</html>