1. Technology

Learn Modern Unobtrusive JavaScript



The Alert built-in object is a little different from those that we have looked at so far in this series of tutorials. In fact alert is more of a method than an object since the only way that you can use it is to call alert(text) where text is a variable that contains whatever you want the alert to display or a quoted string if you want to display a constant value.

The alert method actually interacts with the browser itself to display a dialog box that contains the text that you pass it, an "OK" button to close the dialog, and - in some browsers - a checkbox allowing you to disable JavaScript in the web page.

That some browsers have the checkbox makes this completely unsuited to your using this in a live web page since it would mean that you are providing some of your visitors with a way to kill your JavaScript half way through processing. The other disadvantage that it has is that it can only display text. A better option if you want to display a dialog to your visitors is to generate it yourself from scratch using a modal dialog script. That option also allows you to create your own versions of the confirm() and prompt() methods that JavaScript provides also ensuring that you are not giving some of your visitors the turn off JavaScript checkbox. You can even create your own modal dialogs containing whatever content you want with as many buttons performing whatever functions you like using that method.

So why are we looking at the alert dialog here? Well that particular dialog (but not the other two that JavaScript provides) can provide us with an easy way to test our scripts and see what they are doing without needing to use a full debugger. All that we need to do is to insert alert statements into appropriate spots in our script either displaying a different fixed value at each point (which will allow us to trace the path that the processing follows through the script) or displaying the values of selected variables at specific spots so that we can see what the values are that those variables contain at those spots.

If you are going to use alert() statements to test code that contains loops then running your first test using the Opera web browser is a good place to start. The advantage that Opera has is that it is one of the browsers that displays the disable JavaScript checkbox in the alert dialog. That will allow you to stop your test once you see enough alerts to figure out what is happening. If you use a different browser and your code gets stuck in a loop then your only option will be to kill the entire browser rather than just javaScript.

The built-in dialog boxes are completely inappropriate for use in a live web page, particularly since browsers introduced tabs since it is quite possible that your page that is running a script is not the currently open tab and when it pops up a dialog may interrupt your visitor right in the middle of their filling out a form on another web site possibly resulting in their pressing a button on the dialog without intending to. For actual web use in page dialogs that you create yourself is by far the better option.

More of This Tutorial

  1. About.com
  2. Technology
  3. JavaScript
  4. Javascript Tutorials
  5. Learn Modern JavaScript
  6. Unobtrusive JavaScript - Alert

©2014 About.com. All rights reserved.