Skip to main content

✏️ Practice: Branching

Goal: In the Branching lesson, we learned:

  • How to use an if...else statement to add logic to our webpages.
  • The difference between === and =

You will use branching very often moving forward, no matter which programming language(s) you opt to explore in the future. Get the hang of basic branching now by completing one of the exercises listed below.

Warm Up


  • When do we use ===? When do we use = instead? What is the difference between the two?
  • How many if statements can one branch have?
  • How many else statements may one branch contain?
  • Under what circumstances does an else statement execute?

Code


Meet the goal by completing one of the practice prompts below.

Voting Information

Create a page that offers users information about the voting process.

  • The page should prompt the user to enter their current age.
  • If the user is too young to vote, they should see different information than if the user is old enough to legally vote.
  • Minors should be offered links to websites where they may learn about the voting process and age requirements.
  • Those old enough to vote should be offered links to websites to register to vote, locate their nearest polling location/ballot drop box is, or list when upcoming elections will take place.

Animal Wiki

Craft a site with information about turtles, snakes, and insects (or another three animals or items of your choosing).

  • The page should ask the user which animal they'd like to learn about. Use a form to gather which animal the user would like to see. For example, a user should input "turtle" into the form in order to see information about turtles.
  • When a user submits their selection through the form, display a div containing information about that animal (including a picture). All animal divs should be hidden except for the animal that the user has requested to see.
  • Include an else in your branching logic to handle incorrect form inputs — anything that does not match "turtle", "snake", and "insect" (or the names of the 3 animals/items you have chosen). When this happens, show an message to the user that states they've made an error in their input.