Interactivity, shminteractivity. Most web pages that claim interactivity really mean you can click on hyperlinks to go to new pages. Even web pages that have CGI scripts behind them don’t really seem all that interactive: Fill out a form, hit the Submit button, and wait. It’s more like throwing bottles into an ocean and hoping for a meaningful reply.
All About This Tutorial
Here’s a brief outline of what you will learn each day, with an example of what you’ll be able to do by the end of that lesson.
- Day 2: Variables, if-then branching, link events, and image swaps
- Day 3: Windows, frames, and the Document Object Model
- Day 4: Loops, arrays, and functions
- Day 5: Forms, forms, and more forms
Down to Business
If you view source, you’ll see something that looks like this:
Right now, you don’t really have to put the
// and the end of a line is a comment and will be ignored.
Comment, comment, comment! A basic rule of good programming style is that you should always think about the next person who has to look at your script. It might be a friend, a co-worker, an employer, or it could be you in three months.
The easiest way to make sure you’ll understand your own script in three months is to comment freely and often. If you want to comment a huge block of text, you can put it between
*/ like this:
/* this is a huge block of text that I've commented out */
alert("Soon, I will rebuild my browser!"); calls up a simple dialog box with the words “Soon, I will rebuild my browser!” inside.
<script> tag. Further, using this technique to hide a script is NOT XHTML compliant. It is, however, an interesting (historical) hack that’s worth a read.
The problem with the last example is that some old browsers don’t understand the
//put up an alert box, to show how they work alert("Soon, I will rebuild my browser!"); '''Congratulations!'''
Which isn’t great. Luckily, there’s a trick involving HTML comments:
The reasons why this trick works evaded me for a while, and you can use it without understanding why it works. However, if you really want to know, here’s why the comment trick works.
Once you’ve conquered that assignment, take a minute to read our review of Lesson 1.
- Browser-compatibility problems
- How to comment (freely and often!)
- How alert boxes work
Today was just an introduction to give you a feel for how things work. Next time we’ll start getting serious.
Topics for next time:
- How to do those nifty image swaps
Ready? Then on to Lesson 2!