IT 452 - Tips for Debugging

JavaScript / DOM manipulation

• Your first line of defense is Tools->Error Console -- use Firefox so you have this!
• Make sure to validate your HTML -- bad HTML will break your code
• Add calls to window.alert() to verify that parts of your code are executing, and to check what the values of things are.
• A particular useful command is:

                   window.alert(curNode.nodeName);
              

  This tells you whether the 'curNode' is really a "TD" or a "TR" or a "H1" element or what.
• If you try to manipulate the DOM tree (e.g. to move something) and it doesn't work, the problem might not be your code to manipulate -- it could be that your HMTL was malformed to begin with, or that you previously added some new DOM elements (like adding a new row) that didn't work. (see below)
• Use the DOM inspector to check what your DOM tree looks like (and see if you added things correctly to it). To install it in Firefox, select Tools->Add-ons, then clikc "Get Add-ons" and search for "DOM inspector"

This page last modified