CIS217: Introduction to JavaScript

Sample Site

The samples in this site are designed to demonstrate the technologies highlighted in the book and act as a supplement to the resources provided.

Download this site as a Zip file.

Samples by Topic

Chapter 1: Getting Acquainted with JavaScript

JavaScript is a scripting language--that means it does not have all of the features of a full programming language like Java or Visual Basic .NET.
JavaScript is also know as ECMAScript and JScript (Microsoft's term).
JavaScript is not Java.

Chapter 2: Getting Started

Click here to see a JavaScript alert
Navigate with a warning

Chapter 3: Language Essentials

Most of chapter 3 was dedicated to the Bingo card example. I have included the final version here for reference.

Bingo Card
Make a choice: Red Blue Green
Perform Math

Chapter 4: Working with Images

Working with images and forms are the two most important tasks that drive a webmaster to JavaScript. It is fairly easy once you understand the basics of handling events. If necessary review Chapter 9 to gain more information about events, first.

This image uses a three state rollover based on the class="rollover"
Rollover one of the following words and it changes the text to the right: Red Blue Green
I have used the title attribute to store the information to display in the rollText span tag.

However, you could modify this script to use Ajax to pull in a code snippet and fill a much larger DIV tag. This is something like what Amazon.com uses for its menus at the top of the screen that appear as you mouse over. Your HTML code could certainly contain images and hyperlinks (remember the images need to have their source set relative to this page, rather than where you are storing the code fragments).

For example, if you keep all of your code framents in a directory called productinfo and the images were kept in a directory called images under productinfo, but you wanted to display all of this on your home page (in the root), your images would need a src="productinfo/images/myimage.jpg".
Here is a slideshow of my family photos. It does not use AJAX so it can pull up images from a different server (AJAX can only retrieve files from the same web server).

Chapter 5: Frames

I have added code to prevent this window from being displayed in a frame
if (top.location != self.location) { top.location.replace(self.location); }
Frame Sample Page

Chapter 6: Browser Windows

Chapter 7: Form Handling

The example provided in the book is a very powerful, but difficult to follow example. It can be used, as is, with little modification. However, I recommend using a much more simple model when starting out with JavaScript and the DOM.

Chapter 8: Forms and Regular Expressions

Regular Expression are very complex. Once created they are extremely difficult to decipher, even for an exerienced programmer. As a result, they are outside the scope of this class.

Chapter 9: Handling Events

Chapter 10: Cookies

Chapter 11: CSS

Chapter 12: Objects and the DOM

I am currently looking for a good reference on the DOM (online, as well as in print).

Chapter 13: Making Pages Dynamic

Chapter 14: Applied JavaScript

Chapter 15: Introducing Ajax

Link to the first article discussing Ajax
This drop down list box of states is populated using AJAX to retrieve the list of states
Display the Bookmarklets sample in the DIV area (upper right corner).

Chapter 16: Ajax Toolkits

These examples are right out of the book

Chapter 17: Bookmarklets

Display the Bookmarklets sample in the DIV area (upper right corner).

Other AJAX Toolkits

Useful Links

Visit the book's website
Sample Chapter(s):
Microsoft Visual Web Developer 2005 Express Edition: Build a Web Site Now! (compressed PDF file, 10 MB)
Get a quick start to building dynamic Web pages—without a single line of programming code!
Free Visual Studio 2005 Standard Edition
Attend Two Visual Basic 2005 Labcasts and receive a complimentary copy of Visual Studio 2005 Standard Edition.
XHTML 1.0 Specifications