In this challenge we have created a client-side script using HTML, CSS and JavaScript to help a Maths teacher create homework worksheets for their class.
Our HTML page uses a web form, for the teacher to select various options based on the Maths skills they want to cover and the desired level of difficulty.
The JavaScript code attached to the “Create Worksheet” button is retrieving the user inputs from the various drop down lists. It then uses these to generate list of arithmetic equations and display these on the HTML page.
HTML, CSS & JavaScript Code
See the Pen Maths Homework Generator by 101 Computing (@101Computing) on CodePen.
Your Task
Reverse engineer this JavaScript code to understand how it works. For instance can you identify:
- The purpose of the getDropDownListValue() function defined on lines 1 to 4?
- The purpose of lines 7 to 49?
- The purpose of the switch case on lines 12 to 33?
- The purpose of the for loop on line 37?
- The purpose of lines 38, 39 and 40?
- The purpose of line 42?
- The purpose of line 44?
Challenge #1: 2 or 3 operands per equation?
Now that you understand how this code works, complete it in order for the Maths teacher to be able to chose the number of operands per equations. For instance, if the Maths teacher chooses two operands it will generate equations such as “2+7”. If the teacher chooses three operands, an example of equation could be “2+4-7”.
Challenge #2: Find the missing operand
Change the code to generate equations with a missing operand. For instance: “2 + ??? = 9”
Challenge #3: Linear Equations
Change the code to generate linear equations. For instance: “3x + 2 = 11”
Challenge #4: Quadratic Equations
Change the code to generate quadratic equations. For instance: “4x2 + 5x + 2 = 0″