讲解 AST20201、辅导 Java编程设计
AST20201 Web Programming
Lab 4 JavaScript-2
Submission:
Save all completed html, CSS, images files in a folder name lab4_yourname, with sub-folders for
organize the folders if necessary. Zip the folder and submit to Moodle before the due date
specified in Moodle. Note, you need to make sure all image paths/links could be work
appropriately in your submitted folder and subfolders.
Task
Start the work with the file called “attendance_start.html”. Find all ‘TODO” comments and
insert your code to complete the followings.
When load the page, it shows
a list of students’ names.
If the lecturer checks some
students, such as the first 4
students in this case.
2
Some basic criteria:
• The table should be dynamic by use functions to insert rows. Therefore, when the
webpage is first loaded or reloaded, the populate() function is called to insert rows of
sample student records into the absentees table. All students are assumed absent at the
beginning. Note: in this exercise, it directly adds a group of names inside the function.
[you may change it to read a database, or XML, JSON files in later to provide dynamic
list]
• The webpage is responsive – when the device width gets to be less than or equal to 600
pixels, then the three columns willstack on topof each otherinstead of next to each other.
• You are expected to use JavaScript to implement the solution to this question. However, if
you do want to use jQuery instead, you are still allowed to do so.
• Except jQuery, you are NOT allowed to use any other libraries or 3rd party plugins.
• All your code should appear in one HTML file only, i.e., no separate .js file(s) [Note
separate css file is allowed].
[It your submission include any parts of code is not developed by you; it will not be given
marks. Therefore, try to complete the task base on your own codes as far as possible]
The checked students will be
display in the same page.