Chapter 2: How to code a JavaScript application

This chapter presents a subset of JavaScript and DOM scripting that will soon have you writing significant applications. If you don't have any programming experience, this chapter also makes a great aptitude test. If you read it and can do the exercises at the end of the chapter, you're ready for the rest of this book.

How to test a web page

When you finish editing a file for a web page, you need to save it. Then, to test the web page, you open the page in your web browser. To do that, you can enter the address for the web page in the address bar and press the Enter key, or you can use the FileOpen command. If you're using Windows, you can also find the file in the Windows Explorer and double-click on it.

When the page is displayed in your web browser, you can test it by entering any required data and performing the actions indicated by the controls on the page. This is illustrated by the Firefox browser in figure 2-2.

If the application doesn't produce the right results when you test it or if it doesn't produce any results, your code has one or more errors. Usually, these are syntax errors but sometimes they are logical errors like omitting a line of required code. Either way, you need to find the errors.

When you find the errors, you need to edit the file to fix the errors and save the file. Then, to test the application again, you can return to the web browser and click the Reload or Refresh button. This reloads the edited file. At that point, you can test the application to see whether the problems have been fixed.

For some applications, though, clicking the Reload or Refresh button won't clear the browser memory completely so your changes won't work. In that case, you may need to close the browser window and open the application again.

To help you find the errors in simple applications, you can use the Error Console of Mozilla Firefox as shown in the next figure. Then, in the next chapter, you'll learn how your browser can help you find errors in more complex applications.

The Sales Tax application in the Firefox browser

How to test a web page for the first time

• Open the web page in your browser using any of the techniques in figure 1-15 of the last chapter. Then, enter the required input data, and run the application.

How to retest a web page after you change the source code

• To reload the edited file for the page, click the Reload or Refresh button. Then, run the application.
• Sometimes, clicking the Reload or Refresh button won't clear the browser memory completely so your changes won't work correctly. In that case, you may need to close the browser window and reopen the application.

What to do if the application doesn't do anything when you test it

• If the application doesn't do anything when you test it, it either has syntax errors or other types of coding errors.
• In the next figure, you'll learn how to use Firefox to display error messages for syntax errors. That should be all you need for fixing simple programs like the ones you'll be able to write when you complete this chapter.

Description

• This chapter shows how to write JavaScript applications, and the next chapter shows you how to test and debug them.

Figure 2-2 How to test a web page