JavaScript Errors and Other Code Malfunctions

This tutorial discusses the types of problems and errors that can occur when implementing JavaScript code from dyn-web or other sources. Perhaps you observe that the demonstration documents provided work just fine, but when you try to incorporate the code into your documents you run into problems.

JavaScript error messages may be generated, or perhaps the code fails silently for no reason that you can discern. This tutorial is intended to help you find solutions for these problems.

Locating Error Messages

How do you know whether a JavaScript error has occurred or not? That depends upon what browser you are using and it's configuration.[1] Internet Explorer displays a yellow warning icon in the status bar. Double-click to open a dialog box, then click on Show Details for information about the problem. You can adjust your settings so that the dialog box will always open up when an error occurs, but unfortunately Internet Explorer's error messages are often not as informative as they could be.

Mozilla-based browsers, such as Firefox, are known to provide more informative error messages. View error messages in Firefox through the Tools menu, Error Console.

Common Sources of Problems

Missteps and oversights in implementing JavaScript code may not always result in JavaScript error messages, or the messages that do appear may be difficult to interpret. So it may be helpful to consider some common sources of difficulty along with possible error messages they may generate.

Missing JavaScript files
Be sure that required external files are in place, along with their script tags in the proper order with path specified correctly. Otherwise, the likely result will be one of the following error messages: [something] is undefined, or Object expected, or [something] is not a function, or Object doesn't support this property or method.
Missing DOM elements or problems with ID
Check that HTML elements required by the code are in place with their ID's specified correctly. ID's are case sensitive and must follow certain naming conventions in order to be recognized consistently by browsers.[2] Results of missing or unlocated DOM elements can vary. The code may fail silently or, in Internet Explorer display the error message: Object required or 'null' is null or not an object; in Firefox: [something] is null.
Missing or incorrect style specifications
Be sure that any style specifications required by the code are in place and consistent with instructions and example documents. The code may fail silently without them, or display incorrectly.
Code not properly initialized
Check that any necessary initialization routines are in place and that they are being properly invoked.[3] Modern code will generally not display errors when not properly initialized.[4]
Syntax errors introduced during implementation
It is very easy to introduce syntax errors into the code, when adding images for rotation or content for tooltips, for example. Fortunately, these will generate helpful JavaScript error messages. Read on for assistance in deciphering these error messages.

Common Syntax Error Messages

A few of the common syntax errors which may be inadvertently introduced during implementation are listed here, along with their meaning and possible solutions.

Unterminated string constant (or literal)
Check to see whether you have inserted a carriage return in the middle of a string variable value or array element, or deleted a quote or have mismatched quote pairs. The line number in the error message will point you to the location.
You can use double quotes or single quotes to enclose a string. But they must be in pairs. If you want an apostrophe to appear in your string enclosed in single quotes, put a backslash before the apostrophe.
String variables may need to contain quoted html attributes, in which case it is easiest to use single quotes to enclose the variable content. Here is an example which also contains an apostrophe:

var msg='<div class="info">Here\'s the content.</div>';
Expected ')' or missing ) after argument list
Perhaps you have left out a comma between array elements, or inserted an unescaped apostrophe in an array element enclosed in single quotes.
Expected ']' or missing ] after argument list
Same as above when using array literal syntax.

Some code at dyn-web, such as Tooltips and Rotate Images, use object literals for implementation. A brief tutorial on Object Literal Syntax is available. That tutorial as well as the information provided above should be of assistance if you encounter errors in the use of object literals.

What to Do When the Code Doesn't Work

If the code doesn't work, begin the troubleshooting process by looking to see if there are any error messages displayed. Check to be sure that you have not overlooked any of the items listed in the common problems section above.

If you are a licensed user of the code, we invite you to contact us regarding any problems you are having.

More Information

It is highly recommended that you check your documents in both Firefox and Internet Explorer before making them publicly available. Some problems or errors may be triggered in Internet Explorer but forgiven by Firefox and perhaps other browsers, or vice versa.

If you are encountering errors when working with object literals perhaps our brief tutorial on the subject would be of assistance.

If you have purchased a license for use of the code, feel free to call upon us for assistance with problems implementing the code.

The problems and errors covered in this tutorial are just a few of the most common that might occur when you try to implement code that you know works (i.e., it worked in the demo). Error messages during code development and debugging are another matter entirely.

  1. If you are using Firefox's very handy Web Developer extension you may see a red exclamation mark in the far right of the toolbar when a JavaScript error has occurred. Click on it to open the Error Console. ^
  2. ID's may contain only letters, digits, underscores, and dollar signs (not spaces). They may not start with a digit. ^
  3. Less modern code may not be initialized if multiple onload handlers compete. See Combining Scripts. ^
  4. Some older less robust code may trigger errors when event handlers are activated, for example when users hover over links set up for use by the code. ^

Back to top