javascript debugging in HTML file

Question

How can I put break points in an HTML page in javascript functions to see values of variables as lines get executed. What is the easiest way of doing so?

thanks

Answer 1

Use the keyword "debugger;" to attempt invoking a hard breakpoint.

As long as your browser has Javascript Debugging enabled, then the debugger; statement will tell it to do it's thang and you'll be in a step-by-step debugger.

The Firebug extension for Firefox is by far the easiest, but Internet Explorer's new built-in "Developer Tools" option is quite nice too. Firebug I must say is easier and more polished, but I often must validate in a pile of different browsers and in some cases only Internet Explorer like when debugging the interaction of client-side Javascript and a custom ActiveX control.

The "debugger;" statement always seems to be the golden key to quickly get in to a debugger across platforms and browsers without jumping through a bunch of burning hoops.

So you might have some block of Javacscript like the following, and the browser would invoke the line-by-line debugger on "debugger;" like it was a breakpoint...

var a = 5;

var b = 6;

debugger;

a = b;

Answer 2

You should get Firebug.