Lab 6: JavaScript
Goals
After completing this lab, you should be able to
- write basic JavaScript code
- modify the style of DOM objects
--- Lab 6 FAQ ---
JavaScript
You can and should look at the examples.
See the JavaScript resources on the Resources page on the Wiki.
How old are you? (35 pts)
Create a new HTML file in
your public_html/cs335/submissions/
directory
called age.html
Write the HTML and the JavaScript that computes how old you are in years and days. The page should display your birthdate as well as your age. Make sure your code works whenever a person accesses this page, not just today or this term.
Notes:
- First, compute the number of years you've been alive. Use the
Date
object. Don't hardcode the current year into your script. - Then, compute the number of days since your last birthday.
- Round the number of days down.
- Date peculiarities:
date.getYear()
returns the year since 1900, so this year returns 116. As mentioned in class, what method should you use instead? However, the parameter used when setting the date is the 4 digit year.
Toggle Color (30 pts)
Add a button to your CS335 home page that toggles the color of your
h2
elements between the original color and another color.
Note: you'll need a global variable that contains the previous color (or
the new color the first time).
- How do you find all the
h2
elements? - How do you iterate through the
h2
elements?
Form Validation (35 pts)
Copy your Lab2 sandwich form to a file
called lab6_sandwich.html
. If you updated the form for
Lab 3, copy that code onto this page.
Add JavaScript to your form so that it requires that the user chooses a value for base and cheese before submitting the form. (No cheese is a valid choice.)
Take It to the Next Level
Find an example of JavaScript on the Web and apply it to one of your Web pages. You can find examples at w3schools and by looking on many web pages. Somehow link or let me know that you did this task.
Turnin
Add links to your age.html
and lab6_sandwich.html
pages under the "Submissions"
heading on your cs335/index.html
page.
Grading (100 pts)
This lab is due tonight at 11:59 p.m.
- See breakdown for programs above.