| File | Description |
|---|---|
| basic.html | Demonstrates the separation of concerns and validation links |
| literals.html | Demonstrates different types of literals |
| variables.html | Demonstrates various types of simple variables |
| operators.html | Demonstrates commonly used numeric and string operators |
| prompts.html | Demonstrates the use of the prompt dialog |
| arrays.html | Demonstrates simple array operations |
| assocarrays.html | Demonstrates simple associative array operations |
| if.html | Demonstrates simple if statements |
| ifelse.html | Demonstrates an if statement with an else clause |
| ifnest.html | Demonstrates a nested if statement |
| ifelseif.html | Demonstrates an if statement with an else-if clause |
| while.html | Demonstrates a while loop |
| whilearray.html | Demonstrates array processing with while loops |
| dowhile.html | Demonstrates a do-while loop |
| for.html | Demonstrates a for loop |
| forarray.html | Demonstrates array processing with for loops |
| forin.html | Demonstrates array processing with for-in loops |
| function.html | Demonstrates the definition and invocation of a simple function |
| functionparams.html | Demonstrates the definition of a function using parameters and invoking it using arguments |
| functionargarray.html | Demonstrates the definition and invocation of a function that utilizes the arguments[] array |
| functionreturn.html | Demonstrates the definition and invocation of functions using the return statement |
| scope.html | Demonstrates the concept of scope |
| objects.html | Demonstrates the definition and use of user-defined objects |
| coreobjects.html | Demonstrates the use of some objects from JavaScript Core |
| corestart.html | Demonstrates the use of the book's Core library and its start() method |
| walkdom.html | Demonstrates the use of my WalkDOM object for displaying a page’s DOM hierachy as text |
| getbyid.html | Demonstrates the use of the getElementById() method |
| getbytagname.html | Demonstrates the use of the getElementsByTagName() method |
| getbyclass.html | Demonstrates the use of the getElementsByClass() method from the book's Core library |
| attributes.html | Demonstrates the how to access element attributes via the DOM |
| stripy_tables.html | Code from the textbook that demonstrates how to stripe alternating rows of a table |
| addcontent.html | Demonstrates how to use the DOM to add content to a page |
| eventhandler1.html | Demonstrates a simple event handler |
| eventhandler2.html | Demonstrates how to override an event’s default action with an event handler |
| eventhandler3.html | Demonstrates how to use the this keyword and the open() method to set several links to open their destinations in a different window (or tab) |
| eventlistener1.html | Demonstrates a simple event listener |
| eventlistener2.html | Demonstrates how to override an event’s default action with an event listener |
| tooltips.html | Code from the textbook that demonstrates the implementation of fancy tooltips for links |
| accordion.html | Code from the textbook that demonstrates how to expand and contract portions of a list interactively |
| settimeout1.html | Demonstrates a simple timeout |
| settimeout2.html | Demonstrates a simple timeout being passed a value with a closure |
| cleartimeout.html | Demonstrates a simple timeout being cancelled by clicking a button |
| tooltips_delay.html | Code from the textbook that demonstrates the implementation of fancy tooltips for links with a brief timer-based delay |
| robot_animation.html | Code from the textbook that demonstrates a simple frame-based animation |
| path-based_motion.html | Code from the textbook that demonstrates a constant rate, one-dimensional, path-based animation |
| path-based_motion2.html | Code from the textbook that demonstrates a constant rate, two-dimensional, path-based animation |
| path-based_motion3.html | Code from the textbook that demonstrates a decelerating, two-dimensional, path-based animation |
| path-based_motion4.html | Code from the textbook that demonstrates an accelerating, two-dimensional, path-based animation |
| accordion_animated.html | Code from the textbook that demonstrates how to expand and contract portions of a list interactively using an animated effect |
| scriptaculous_highlight.html | Code from the textbook that demonstrates how to use an animated fade in effect implemented within the script.aculo.us library |
| dependentfields.html | Code from the textbook that demonstrates how to make controls within a form dependent upon the status of another control |
| cascadingmenu.html | Code from the textbook that demonstrates how to create a pair of menus based upon a single menu, such that the contents of the second menu update dynamically as selections are made in the first |
| requiredfield.html | Code from the textbook that demonstrates how to validate a required text field in a form |
| formvalidation.html | Code from the textbook that demonstrates a reusable form validation object using regular expressions |
| slider.html | Code from the textbook that demonstrates custom slider control |
| try-catch_test.html | Code from the textbook that demonstrates the try-catch structure |
| weather_widget.html | Code from the textbook that demonstrates an AJAX widget |
| contact_form.html | Code from the textbook that demonstrates an AJAX form submission |
One important tool in learning about JavaScript is to examine the code for existing programs.
Although there are many samples to study available on the Web, there is no way for a beginner to accurately judge the correctness of their code. Therefore, studying code selected at random on the Web is just as likely to teach a beginner incorrect techniques as correct techniques.
For this reason, I have published several sample documents in strict compliance with the XHTML and CSS standards and JavaScript coding guidelines presented in this class. Each file is available via a link above. They are designed to present informative and correctly implemented source code. Therefore, you should not only examine the page itself, but also the source code that the browser used to render it if you intend to get the most out of these resources. In fact, it’s recommended that you view and experiment with these files in a variety of different browsers and environments. At the very least, try the browsers available on the Windows and Mac computers in the clusters.
Please note that the samples are presented in the order in which they are most likely to be useful in the context of this course. Only a handful of the samples are my own original creation. Most of them are adaptations of the sample programs Andy Harris has presented in the textbook (modified to comply with our coding guidelines and the standards). In these cases, the name of the file begins with “harris-” and ends with an indication of the page number of the book on which the source code begins.