In this exercise you will work with an array and add nodes to the DOM to display the results and test scores.
Download the starter files here.
Your app is a Grade Management System. The page has input boxes for student name and score. It also has an empty table to display the grades and a div to display the class statistics. Please reference this document TestScoresProblem.pdf for screen shots clarifying the instructions. The two buttons should function as follows:
Add student button: Input name and score and press this button.
- Validate that name is entered
- Validate that score is a number between 0 and 100
- If either input is not valid, display message in the span element
- If data is valid, add values to the array and display the updated table in the table on the page with id of “scores_table”
- Clear the inputs after, focus on name
- Clear the results section when a new student is added
Class statistics button:
- Calculate class average, display with 1 decimal place
- Calculate highest score. Display score and student name.
- Display results in the div on the page with id of “results”
- If there are no students then display a message of “No students”