Guess the Number
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Guessing Game</title>
</head>
<body>
<h1>Guessing Game</h1>
<p>Guess the secret number between 1 and 100.</p>
<input type="number" id="guess" min="1" max="100">
<button type="button" id="submit">Guess</button>
<p id="result"></p>
<script>
// Generate a random secret number between 1 and 100
const secretNumber = Math.floor(Math.random() * 100) + 1;
// Get the guess input and submit button elements
const guessInput = document.getElementById("guess");
const submitButton = document.getElementById("submit");
const resultElement = document.getElementById("result");
// Add an event listener to the submit button
submitButton.addEventListener("click", () => {
// Get the guessed number from the input element
const guess = parseInt(guessInput.value);
// Check if the guess is correct
if (guess === secretNumber) {
// Display a message indicating that the guess is correct
resultElement.textContent = "You guessed the correct number!";
} else if (guess < secretNumber) {
// Display a message indicating that the guess is too low
resultElement.textContent = "The secret number is higher.";
} else {
// Display a message indicating that the guess is too high
resultElement.textContent = "The secret number is lower.";
}
});
</script>
</body>
</html>