↑
Main Page

Breakpoints and stepping

The last utility window is labeled Command Window and is very similar to the Immediate window in

Visual Studio. Here, you can type in JavaScript commands in the context of the executed code to check

the values of variables. To do this, simply type the variable whose value you want to see followed by a

semicolon. For instance, to get the URL of the window, type:

window.location.href;

When you hit the Enter key, the line of code is evaluated and the value displayed.

Breakpoints and stepping

The Debug toolbar (Figure 14-13) contains all the options you need to step through JavaScript code and

set breakpoints.

Figure 14-13

To set a breakpoint in your code, load the file into Internet Explorer and then open the debugger. Find

the file you want to debug in the Running Documents window and double-click it. Then, go to the line

of code you want to stop on and click the Set Breakpoint button (the white hand) in the toolbar. The line

is then highlighted in yellow, and a yellow arrow is placed in the margin. Then, go back and reload the

page in Internet Explorer and run the command; execution stops at the specified point and the debugger

takes over.

At that point, you can do several things. If you want to step through the code, you can use the Step Into

(which executes the code line by line, stopping after each one), Step Over (which doesn’t follow code

execution into functions), and Step Out (which moves execution outside of the function to the place

where the function was called).

If you want to continue normal execution of the code until the next breakpoint, click the Run button; if

you want to stop debugging altogether, click the Stop Debugging button to prevent any further stoppage

in the code’s execution.

Run and Stop Debugging

Run to Next Breakpoint

Break at Next Statement

Step Over

Set Breakpoint

Step Into

Step Out of

Clear All Breakpoints

434

Chapter 14

17_579088 ch14.qxd 3/28/05 11:41 AM Page 434