Explore

The Game Master: Guessing Game Worksheet:

This worksheet will guide you through building a simple number guessing game using HTML, JavaScript, and a touch of playful interaction.

Step 1: Create the HTML file:

Create a new file named guessing_game.html. Open it in your text editor. Add the basic HTML structure:

⁠

Step 2: Add the Game Master Image:

Inside the <body> tag, add an img element to display the Game Master. Give it an id for easy access with JavaScript:

⁠

(Replace "game_master.jpg" with the actual path to your image.

The style="display:none;" initially hides the image.)

Step 3: Create the "New Game" Button:

Add a button that will start the game:

⁠

Step 4: Create the JavaScript file:

Create a new file named script.js in the same directory as your HTML file.

Step 5: The newGame() function (Part 1):

In script.js, start the newGame() function. This function will handle the initial game setup:

⁠

Step 6: The newGame() function (Part 2):

Continue the newGame() function to get the player's age and handle the age check:

⁠

Step 7: Get the player's guess:

Still inside the newGame() function, prompt the user for their guess:

⁠

Step 8: Generate the Game Master's guess:

Generate a random number for the Game Master:

⁠

Step 9: Determine the winner (whoIsTheWinner() function):

Create a whoIsTheWinner() function to determine and announce the winner:

⁠

Step 10: Call whoIsTheWinner() and end the game:

Back in the newGame() function, call whoIsTheWinner() and end the game:

⁠

Now, open guessing_game.html in your browser and play! This detailed breakdown should help you understand each step of the process.

Remember to add error handling and input validation for a more robust game.

Want to print your doc?
This is not the way.

Try clicking the ⋯ next to your doc name or using a keyboard shortcut (

CtrlP

) instead.