In the previous exercise you learned how to extract data from an object and inject it into a webpage. During the process you created a drop-down list that triggered a function so that, whenever a given value was clicked, a drink name, image, and description appeared on a web page.
Your job for this assignment is to create something very similar with a couple of twists. Here are the instructions:
- Using beverage.js from the previous lesson as an example, create your OWN object with at least 5 name value pairs. (The beverage lesson had five name value pairs)
- Create just ONE function that will display the value of a given name on a web page when a button is clicked. This will require you to add an argument to your function and add a value for the argument when you call the function from a button.
- Create a series of buttons on a webpage that will call the function and display the value for a given name when the button is clicked. You can hard-code the buttons into html (the easy way) or impress me and use JavaScript to generate the buttons in your html (the hard way).
Hint: When you call the function from a button you will need to use single quotes around the argument. In the example below, my function is titled nameit and Latte is the argument.
onclick=”nameit(‘Latte’)”
Here are some examples:
