IST-239 Final Project

Lab Projects

36 projects organized by unit and chapter.

Unit 1 — Functions, Operators, and Arrays

Chapter 1 — Introduction to JavaScript

Project 1-1

This program uses document.write() to generate an ordered list of financial planning tips directly in the browser. Each tip is placed in an individual <li> element inside an <ol> element, giving the information a clear and structured format. The project demonstrates how JavaScript can create and insert HTML content dynamically when a page loads.

Open Project 1-1

Project 1-3

This project presents a web-based order form that collects contact information and reservation details, including pickup and drop-off dates. An onclick event handler runs when the submit button is selected. The handler displays a “Thank you for your order” confirmation message beneath the form, providing immediate feedback to the user.

Open Project 1-3

Project 1-5

This project focuses on debugging JavaScript errors found in both the head and article sections of a web page. The corrections include keyword capitalization, missing punctuation, function syntax, and mismatched variable names. Six errors were identified and fixed so the script could run as intended.

Open Project 1-5

Chapter 2 — Working with Functions, Data Types, and Operators

Project 2-1

This program converts temperatures between Fahrenheit and Celsius. When the user enters a value in either input field and then presses Tab or moves away from the field, JavaScript calculates the corresponding temperature in the other unit. The converted value is rounded to the nearest whole number and displayed automatically, creating a simple interactive conversion tool.

Open Project 2-1

Project 2-3

This project displays three shape elements: a square, triangle, and circle. JavaScript assigns mouseover and mouseout event handlers to each shape. When the pointer moves over a shape, a feedback paragraph identifies it, and the message is cleared when the pointer moves away.

Open Project 2-3

Project 2-5

This program provides a basic calculator interface in which number and operator buttons add characters to a text area. Selecting the Enter button evaluates the completed expression and displays the result. The debugging work corrected event-handler assignments, function references, variable naming, and missing parentheses so the calculator responds properly to each button click.

Open Project 2-5

Chapter 3 — Building Arrays and Controlling Flow

Project 3-1

This program calculates the total price of selected lunch items using checkboxes. Each checkbox stores a numeric price in its value attribute, and JavaScript checks the selected items whenever the user changes the order. The script converts the stored values to numbers, adds them together, and displays the total in currency format.

Open Project 3-1

Project 3-3

This program generates a table containing the top ten IMDb movies. JavaScript loops through arrays of movie titles, summaries, ratings, and links to assemble each table row. The completed rows are inserted into the table body, demonstrating how array data can be transformed into organized page content.

Open Project 3-3

Project 3-5

This project displays phone sales data as a horizontal bar chart built with table rows and cells. JavaScript calculates the overall sales total and determines the percentage represented by each phone category. Those percentages control the visual length of each bar, allowing the data distribution to be compared at a glance.

Open Project 3-5

Unit 2 — Debugging, DOM, and Forms

Chapter 4 — Debugging and Error Handling

Project 4-1

This program estimates moving costs from the shipment weight, travel distance, and optional setup services entered by the user. JavaScript validates the form values and displays clear error messages when the input is missing or invalid. When the entries are acceptable, the script calculates and displays the estimated total cost.

Open Project 4-1

Project 4-3

This program monitors the number of characters entered in a user comment. A keyup event causes JavaScript to recalculate the current character count as the user types. When the comment exceeds the allowed limit, the page displays a warning so the user can revise the entry.

Open Project 4-3

Project 4-5

This program converts angular measurements between degrees and radians. Event handlers detect when the user changes either input field and automatically calculate the equivalent value in the other unit. The page updates immediately, allowing either measurement system to be used as the starting point.

Open Project 4-5

Chapter 5 — Working with the Document Object Model (DOM) & DHTML

Project 5-1

This program presents an online Algebra I practice quiz with a countdown timer. The quiz remains hidden behind an overlay until the student selects Start Quiz, after which the timer decreases once per second. When time expires, incorrect responses are highlighted, the number of correct answers is reported, and a congratulatory message appears when every answer is correct.

Open Project 5-1

Project 5-3

This program automatically builds a table of contents for a document about the United States constitutional amendments. JavaScript examines the article's child nodes, identifies each h2 heading, and creates a matching internal link. The generated list appears in the aside panel so users can jump directly to any amendment.

Open Project 5-3

Project 5-5

This program provides an online Concentration matching game. JavaScript shuffles the tiles, reveals images when tiles are selected, and compares each pair. Matching tiles remain visible, while unmatched tiles are turned back over so the player can continue searching for all pairs.

Open Project 5-5

Chapter 6 — Enhancing and Validating Forms

Project 6-1

This program provides an account sign-up form that collects a username, email address, password, and password confirmation. JavaScript verifies that the password contains at least eight characters, including at least one letter and one number. It also checks that both password entries match and displays a custom validation message when a requirement is not met.

Open Project 6-1

Project 6-3

This program provides a checkout form that collects shipping and billing information. A user can copy the shipping address into the billing fields when both addresses are the same. JavaScript also checks required text fields and displays a custom validation message when necessary information is missing.

Open Project 6-3

Project 6-5

This program provides a conference registration form for attendee and contact information. Users can select a session package, banquet attendance, and an optional media pack. JavaScript updates the shopping cart automatically and displays the complete registration cost in U.S. currency as the selections change.

Open Project 6-5

Unit 3 — Objects, Methods, and Security

Chapter 7 — Manipulating Data in Strings, Arrays, and Other Objects

Project 7-1

This program uses JavaScript regular expressions to validate a password before an account form can be submitted. The password must contain at least eight characters, one uppercase letter, one number, and one of the required special characters. If a requirement is not met, the page displays a message explaining what needs to be corrected. Once the password passes validation, the submitted account information is displayed on a confirmation page.

Open Project 7-1

Project 7-3

This program uses JavaScript Date objects to create a countdown clock for the upcoming new year. The page displays the current date and time along with the number of days, hours, minutes, and seconds remaining. The countdown updates every second to keep the displayed values current. The program also uses mathematical calculations to separate the remaining time into whole-number values.

Open Project 7-3

Project 7-5

This program uses JavaScript to compare the writing styles of two authors through word-length frequency analysis. Users can load two HTML documents, view their contents, and see how often words of different lengths appear in each sample. The program reads and processes the text, counts words from one through fifteen or more characters, and calculates the percentage for each group. The results are displayed side by side to make the two writing samples easy to compare.

Open Project 7-5

Chapter 8 — Creating Customized Objects, Properties, and Methods

Project 8-1