.



 


INTRODUCTION
(Lesson 1)

Welcome to the Beginning JavaScript Class.  Here you will learn how to jazz up your web pages with a little JavaScript. As you may have guessed, you have already experienced some of the power of JavaScript.  The greeting,  , changes depending on the time of day you visit this page. Cool huh!  You will learn to do this and many other things in this beginning JavaScript Class.

The purpose of this first lesson is to help you understand what tools you need to effectively work in this class. I will also explain what tools are already provided. I recommend that you read though this lesson thoroughly so that you will understand how to use the available tools in this class.


Who is this Class intended for?

This class is intended for you if you would like to go beyond what basic HTML has to offer and add some functionality to your site using JavaScript. If you are unsure as to what JavaScript can do for you and would like to know before you continue in this class, then skip ahead to Lesson 2 and read the section on What is JavaScript?. Make sure you come back here after reviewing that section.

You do not need to be a programmer to learn JavaScript in this class. In fact, a programmer will probably get bored and never finish the class. This class is designed for someone that is comfortable writing HTML coding in a text editor. If you know the basic tags for HTML and can develop a page using a text editor, then I would say you should get along fine in this class. If you exclusively use a web page editor, such as Microsoft Frontpage or Netscape's Composer, and don't really know much about HTML, then I would say that this class will be very difficult for you.


Getting Ready to Learn JavaScript

One of the nice things about programming JavaScript is you do not need any special programming tools. All that is really needed is a simple text editor such as Notepad that comes with Windows 95/98/NT or SimpleText on the Mac. I have had no success using any HTML editor such as Netscape's composer or Microsoft's Frontpage with a document that contains JavaScript.

Notepad is a adequate for writing scripts on the PC. However, a far better choice is EditPad, a Notepad replacement, that is available on the author's web page for only the cost of sending him a postcard. EditPad allows you to have many documents open at once which is invaluable for cutting and pasting. EditPad has some other really nice features including a find and replace feature that I constantly use and a display of the line number that the cursor is on which is really useful when tracking JavaScript errors.


Browser to use for this class

To get the most out of this class, you should have a Netscape 4 or later browser and an Internet Explorer 4 or later browser installed on your computer. Version 4 browsers are very similar in their treatment of JavaScript making it easier for us to learn the basics without having to worry about the peculiarities of the different browsers. Having a copy of both the Internet Explorer and Netscape browsers allows you to test your scripts on both. Understand that these are not the only browsers that scripts will be used on. Therefore, a prudent JavaScript programmer will test scripts on different versions of each Browser.

You can get a free copy of the Netscape browser here and a free copy of the Microsoft Internet Explorer browser here.


What to do if you have a Problem

Making the simplest script work sometimes can take a lot of time and patience. When you get to the point that you just cannot figure out what you have done wrong, the best thing to do is to post your script on your web site and email me using the link you will find in the Help section of the menu that is on every lesson page. Please make sure that you furnish me enough information that I can understand exactly what you problem is.


Recommended Book

A book is not needed for this course. I have tried to include adequate material and on-line resources here so that you do not need a book to learn basic JavaScript. After you complete this course or become convinced that JavaScript is your thing, you might visit our book section and look at some books I recommend there. If you are still a little shaky about HTML or want a good reference, there is an excellent book recommended there that is very inexpensive. The book that I always recommend for the person that is a JavaScript enthusiast is JavaScript Bible. It is the best, but understand that it is not for the beginner. And yes, I do have a recommendation for a good beginner's book to supplement this class if you are interested.


On-line Documentation

Listed below are several sources where you can learn more about JavaScript. The first two are the books that Netscape has on-line that cover the version of JavaScript we will be discussing in this Class. These two books are included in our Library that is discussed in the next section. The next one is the documentation for Netscape's most recent browsers. The next link is for the documentation of J Script, Microsoft's version of JavaScript. Be aware that this documentation takes a different approach to the one I will be teaching here. Sizzling HTML Jalfrezi is my favorite reference for HTML. You can setup a personal book shelf on the Macmillan Computer Publishing site which has several JavaScript books that you can read for free.

Covers Netscape 4.0 - 4.05

Covers Netscape 4.06+ and 4.5+

Covers Internet Explorer 5

Additional References


Our Lab and Library

There are two important buttons in our menu, displayed on the left side of your screen, that I hope you will constantly use. The Lab button brings up a laboratory where you can easily test simple scripts that you see here. The use of the Lab will be explained in Lesson 3. The Library contains a few online books and resources that I think you will find very useful while you are learning JavaScript in this class. Once opened, both of these window will remain open and can be recalled by pressing the button again or by using your tool bar that comes with some operating systems. These two windows will be closed anytime you leave the current lesson you are working on.


Assignments

The best way to learn JavaScript is by writing and debugging scripts. Most lessons will have assignments that involve developing some scripts. I recommend that you make a web page that contains your solutions to the script assignments that you update on a per Lesson basis. Feel free to be innovative and go beyond the basic requirements.

I will post my solutions for the script assignments in each lesson. Understand that all of the script assignments will have more that one satisfactory solution and that yours might be a better approach than mine.

Please do not get discouraged by the fact that most of the assignments in the first lessons do not have any practical value except to teach you something about JavaScript. The assignments will become more practical as we learn more of the necessary JavaScript techniques.


Setting up your Browser to recognize JavaScript Errors

Being able to see errors when you are developing JavaScript is critical. Browsers prior to Netscape 4.06 and Internet Explorer 5.0 display a JavaScript error dialog box anytime an error occurs. If you use one of these browsers, no special preparation is needed.

Netscape and Microsoft determined that displaying this dialog box every time a error occurs is annoying to most people and thus is releasing their newer version browsers with this feature off by default. The affected browsers are:

  • Netscape 4.06+
  • Netscape 4.5+
  • Internet Explorer 5.0+
If you will be using one of these browsers in this class, then you need to make some special adjustments so that you will be able to see JavaScript errors when they occur. The purpose of the section is to guide you as to how to make these adjustments.

You may want do the setup below in conjunction with Lesson 2. We will be demonstrating a JavaScript error in that lesson.

Setup instructions for Netscape 4.06+ and Netscape 4.5+

There are two ways to display error messages in these Netscape browsers. The easiest is to just type javascript: into your Location box and press the Enter key prior to doing any JavaScript development. This will bring up Netscape's Communicator Console. You will need to leave this console open while you are developing JavaScript so that errors can be displayed in it.

The second method requires that you modify your prefs.js file. This is the method I recommend for this class. The procedure for this is covered in Appendix C Displaying Errors with the JavaScript Console of the Netscape JavaScript guide for version 1.3. There are instructions there for setting up your copy of Netscape to open the Console when an error occurs. There are also instructions for setting it up to open an error dialog box. I could not get the error dialog box to open but the console setup works fine.

Setup instructions for Internet Explorer 5

To turn on the JavaScript Error dialog box in the Internet Explorer, first click on the Tools tab of the menu and select Internet Options. This will open the Internet Options window. Click on the Advanced tab. Locate the check box for "Display a notification about every script error" and make sure it is checked. Then click OK.



Assignment

  1. Download and become familiar with any browsers and text editors that you would like to use for this class.

  2. Review any HTML documentation you have if it has been a while since you worked with it.

  3. Visit the sites listed in our library. Try to get a basic familiarity with what they have and an understanding of how the site is organized.



[ Top of Page  |  Contents ]