You are using going to use the following snippet of code to complete the game we are calling “guess me right”
For this we are using a random method from Math
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Number Guessing.</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
</head>
<body>
<div class="container">
<h2 class="text-center">Let's see if you can guess me right.....</h2>
<form>
<div class="mb-3">
<label for="myNumber" class="form-label">Guess Number</label>
<input type="number" class="form-control" id="myNumber" aria-describedby="guessed number">
</div>
<button type="button" class="btn btn-primary">Go!</button>
<!-- If the user guessed it correct or missed it, it will be reported here.-->
<div id="message"></div>
</form>
</div>
<script>
/*
Using Math.random() you can get a number to be generated between
1 and given number
Using the example from mozilla.org, the function provides the
the random number with in the given range.
Math.random() * 10, for example provides numbers between 1 and 10
*/
function getRandomInt(max) {
return Math.floor(Math.random() * max);
}
let guessedNumber = document.getElementById('myNumber');
let button = document.querySelector('button');
let message = document.querySelector('#message');
button.addEventListener('click', function(){
//this is the number to be guessed.
let generatedNumber = getRandomInt(10);
//your code continues here.
//verify if the generated and guessed numbers are equal
//then update the message accordingly.
//Bonus, change the colors of the message accordingly.
})
</script>
</body>
</html>
Complete the code to make print the right message of “Yaay.. you guessed it right” when the number is guessed correctly or to print, “Umm.. you missed it, the correct number was [NUMBER]” when the user misses the number.