👾 Web Dev
Home
  • WDIII

    • Git
    • Intro to DOM
    • Conditional Statements and Functions
    • Arrays
    • Using createElement()
    • Objects
    • Midterm
Home
  • WDIII

    • Git
    • Intro to DOM
    • Conditional Statements and Functions
    • Arrays
    • Using createElement()
    • Objects
    • Midterm
  • Conditional Statements and Functions - Guided practice

Conditional Statements and Functions - Guided practice

Understanding conditional statements and Function declaration

In this exercise, we will create a function that checks a user's age and displays a message on the webpage, based on the age. You will call the function from the console, passing the age as a parameter, and the result will appear in the document.

Objective

  • Conditional Statements: Use if, else if, and else to determine the output based on the age provided.
  • Function Declaration: Write a function that accepts the age as an argument.

Instructions

1. Set Up Your Files

  • Create an HTML file named index.html.
  • Create a JavaScript file named script.js.
  • Link the JavaScript file to your HTML file using the <script> tag.

2. Write the HTML Structure

In index.html, set up a basic HTML structure:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Age Access Checker</title>
</head>
<body>
  <h1>Age Access Checker</h1>
  <p id="result">The result will be displayed here.</p>
  <script src="script.js"></script>
</body>
</html>

3. Declare the Function

In script.js, declare a function named checkAge that takes one parameter age.

4. Implement Conditional Statements

Inside the checkAge function, use if, else if, and else to check the value of age and display an appropriate message base on this rules:

A. Under 13 years old:

  • If the user's age is less than 13:
    • The user is considered too young to access the feature.
    • Message: "Sorry, you're too young to access this feature."

B. Between 13 and 17 years old (inclusive):

  • If the user's age is between 13 and 17:
    • The user is given limited access to the feature.
    • Message: "You have limited access to this feature."

C. 18 years old and older:

  • If the user's age is 18 or above:
    • The user is given full access to the feature.
    • Message: "You have full access to this feature."

5. Test the function via the console

Call the checkAge function in the console sending the age value. The result should be displayed in the document instead of the console.

Last Updated:
Contributors: David Plata Ramirez, platard