siliconforks.com
→
Documentation
→
Debugging JavaScript
This document provides a brief summary of techniques for debugging JavaScript in various popular web browsers.
The instructions assume that you are running Microsoft Windows, but most of the techniques will work on any operating system.
To view JavaScript error messages, you can launch Firefox's error console by selecting
→
from the Firefox main menu.
You may wish to set the preference
javascript.options.strict to true to get additional JavaScript warnings.
Alternatively, you can install the Firebug extension. Firebug provides a tab which will display JavaScript errors. (Note: if you are using Firefox 3, you need to install the latest beta version of Firebug.) Firebug also provides a JavaScript debugger to execute JavaScript code one line at a time, examine the values of variables, and so on.
To log information to the Firebug console, use the console.log function:
var x = 123;
console.log("x = " + x);
Another useful tool for Firefox is the Web Developer extension.
To view the generated HTML source of a document, you have several alternatives:
To view JavaScript error messages, select → . The "Display a notification about every script error" option should be checked.
The best JavaScript debugger for IE 6 and IE 7 is the Microsoft Script Editor which comes with Microsoft Office. To enable debugging in IE, select → and ensure that the "Disable script debugging" checkboxes are unchecked.
To view the generated HTML source for a document, install the IE Developer Toolbar. This provides a tree view of the DOM of the generated HTML source.
JavaScript code can cause memory leaks in Internet Explorer. The JavaScript Memory Leak Detector can locate JavaScript code that causes memory leaks.
IE 8 includes a Developer Tools window that can act as a JavaScript debugger. To launch Developer Tools, do any of the following:
Developer Tools icon.
To debug JavaScript, select the tab in the Developer Tools window, and press the button. Then, in Internet Explorer, navigate to the URL you wish to debug.
You can view the generated HTML source for a document in the tab of the Developer Tools window.
To view JavaScript error messages, launch Opera's error console: select → → .
To log information to the error console, use the
opera.postError
function:
var x = 123;
opera.postError("x = " + x);
You can install two tools that are useful for debugging:
With Opera 9.5, you can use the new Opera Dragonfly debugger. You can launch Dragonfly from Opera's main menu by selecting → → .
To view JavaScript error messages, configure Safari to display the menu. Then select → .
To write to the JavaScript console, use the console.log function:
var x = 123;
console.log("x = " + x);
Safari 3.1 comes with a menu. To enable the menu, select → and select the tab. The "Show Develop menu in menu bar" option should be checked.
To view JavaScript error messages, select → .
To write to the console, use the console.log function:
var x = 123;
console.log("x = " + x);
Safari 3.1 comes with Web Inspector, a tool for displaying the DOM of a document. You can launch Web Inspector by selecting → or by selecting from Safari's context menu.
WebKit is Safari's rendering engine. You can
download a nightly build of WebKit and
run it in Safari. On Windows, unpack the WebKit ZIP archive and execute the
run-nightly-webkit.cmd file.
Nightly builds of WebKit come with a JavaScript debugger integrated in the Web Inspector. To start the debugger, launch the Web Inspector and select .
Copyright © 2008
siliconforks.com