[Enter] [Course Objectives] [Schedule] [Text] [Grading] [Project]

Lab #1: Client Side: JavaScript

Objectives

  1. Use Javascript for dynamic effect in your HTML pages
  2. Validate form input entry using Javascript
  3. Create cookies using Javascript

Background Material

0. Text: Chapter 4 [PDF] (Chapter 6 in Old Book),
Chapter 5 [PDF] (Chapter 7 in Old Book), and
Chapter 6 [PDF] (Chapter 8 in Old Book)

1. Gentle Javascript

2. Bill Grotskys JavaScript 1 [PDF]

3. Bill Grotskys JavaScript 2 [PDF]

4. Cookies in Javascript by Roger Jang

5. Book Examples and notes

Assignment

There are thousands of javascripts on the web, and a number in the text slides above. You may adapt (and do adapt them - don't just use them) any of these to solve the following problems BUT you must include a comment documenting your sources.

Upload your answers using File Exchange (don't forget you must "share" with "glebvs" and "klemone" for us to see them) which may contain URL's of the actual answers Don't make the locations obvious (e.g., lab1.html)

1. (1 point) (INDIVIDUAL) Chapter 4 (6 in old text) , #14: Write, test, and debug an HTML file that includes JS script(s) to create: Function: reverser; Parameter: A Number; Returns: The number with its digit in reverse order. (Include a script to test the function with at least 2 different data sets)

2. (1 point) (INDIVIDUAL) Create a page which asks the user for a password, and if it is correct tells the user via a pop-up window the URL of your personal page. For now, use the password "awt".

3. (1 point) (INDIVIDUAL) Chapter 6 (8), #2 (which includes #1)
(Part 1: Write, test, and debug a document with a paragraph of at least 10 text lines that describes you. This paragraph must be centered on the page and have space for only 20 characters per line. Superimpose a light gray image of yourself (or any image) over the center of the text as a nested element. Hint Use background.image )
Part 2: Modify Part 1 to add 4 buttons labeled Northwest, Northeast, Southwest, and Southeast. When they're pressed, the buttons must move your image to the specified corner of the text. Initially, your image must appear in the northwest (upper left) corner of the text.

4. (1 point) (INDIVIDUAL) Create a page on your site which uses (Javascript) cookies to greet (returning) visitors by name. Don't make this your awt page unless you plan to remove it after this lab.

5. (1 point) Decide about a project. Find someone to work with if you'd like (Post to the discussion board). List your names and a brief description of what you plan to do on your Project Description page.

6. Do the quiz (below) and upload it to us. Do this for every lab.

Quiz (It says "quiz 2", but it's really your first quiz) [PDF]

Quiz Solutions [PDF]