Design Text, Chapter 11, pgs 193 - 222 (Tables)
JavaScript Text, Chapter 2, pgs 59-75(Arrays and Tables)
Reading:
- Hiding HTML tags in JavaScript
- The examples in this chapter use an older style method to hide the HTML tags from
JavaScript. You may use this method or the CDATA notation explained in chapter 1.
- JavaScript Variables
- Study the coding using string and float variables in the Daytona500.html example on pages 64 and 65 in the JavaScript text.
- In order for your HTML tags to validate within your JavaScript code, you must follow the instructions shown on
pages 44 and 45 of the JavaScript text.
- Using Tables
- The MetricPrefixes.html example, on pages 68 - 70 of the JavaScript text uses a table. Study the HTML text of the W3C site
to learn how to code HTML tables in HTML.
- Notice that the MetricPrefixes.html example uses the HTML coding for tables in document.write statements.
Practice:
- Displaying Variables
- Create an assignment3 folder (no spaces in the name, no uppercase) in your public_html folder.
- Daytona500 page
- Click on Daytona500.html.
- Right click on the page.
- View Source
- Save as Daytona500.html (notice you use the uppercase this time and the l in the extension.) in the assignment3 folder.
- This page refers to js_styles.css. You saved that file in your assignment2 folder. Since you are going to re-use this
file, (and other files) make a new folder, jsfiles in the public_html folder.
- Make a copy of js_styles.css from your assignment2 folder and save in your jsfiles folder.
- To refer to the file you must link to the location where your file is stored. The link is written as
<link rel="stylesheet" href="js_styles.css" type="text/css" />
This assumes that your file is in the same folder as your html page.
You can change the link to be an absolute link or a referential link.
- Open Daytona500.html in your editor and change the link to one of the choices below using the correct name for
fLastName.
- <link rel="stylesheet" href="http://pinclab.austincc.edu/~fLastName/jsfiles/js_styles.css" type="text/css" />
- <link rel="stylesheet" href="../jsfiles/js_styles.css" type="text/css" />
- Numerical Data Types
- MetricPrefixes page
- Click on MetricPrefixes.html.
- Right click on the page.
- View Source
- Save as MetricPrefixes.html (notice you use the uppercase this time and the l in the extension.) in the assignment3 folder.
- Be sure to add the validation icons to the page.
- Open MetricPrefixes.html in your editor and change your link to refer to your js_styles.css page.

- Modifying Elements Using Arrays
- Update Daytona500.html
- Open Daytona500.html in your editor.
- Save as daytona500.htm in your assignment3 folder.
- Make the changes noted on pages 74 and 75 of your text.

Case Project:
- Complete Case Project 2-2 found on pages 112 - 113 of your text.
- Open your template.htm page.
- Save as CO2Emissions.htm in your assignment3 folder.
- Follow the steps described in the text but start with the template so that you will
have the validation icons on your page.
- Also, remember that numbers are not in quotes. Text is in quotes.

Update your index page:
- Add links on your index page to the pages in your assignment3 folder that are to be graded:
- daytona500.htm
- MetricPrefixes.html
- CO2Emissions.htm
Uploading:
- Upload your revised index.htm page to the public_html folder.
- Upload your jsfiles with your js_styles.css page.
- Upload your assignment3 folder with the files:
- daytona500.htm
- MetricPrefixes.html
- CO2Emissions.htm
Testing uploaded pages
- Follow the checklist for grading shown on
the schedule page.
- Make any corrections for any page that does not validate or display correctly.