Lab 7: JavaScript

--- JavaScript Lab FAQ ---

JavaScript

You can and should look at the examples.

See the JavaScript resources on the Resources page on the Wiki.

Set Up

• Log into the lab machine so that you can labhelp
• These problems need to be on web pages publicly accessible from your CS335 web page, so put them in your public_html/cs335 directory.

How old are you? (35 pts)

Create a new HTML page called age.html

Write the HTML and the JavaScript that computes how old you are in years and days, e.g., "I am 20 years and 115 days old". The page should display your birthdate as well as your age. (This can just be a hardcoded birthday, not from user input; however, most of your code should be such that someone need only to substitute their own birthday once and the code will still work correctly.)

Make sure your code works whenever a person accesses this page, not just today or this term.

Notes:

• If you're not comfortable using your birthday, you can use the birthday of your favorite celebrity.
• 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 ("135.3543 days" doesn't make sense to a user.)
• JavaScript Date peculiarities: date.getYear() is deprecated and returns the year since 1900, so, for this year as a date, it would return . As mentioned in class, what method should you use instead? Keep in mind, though, that 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.

Consider ...

• How do you find all the h2 elements?
• How do you iterate through the h2 elements?
• How will you alternate the behavior?

Form Validation (35 pts)

Copy your Lab4 sandwich form to a file called javascript_sandwich.html.

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 (Optional)

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.

Submission

Add links to your age.html and javascript_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.