Latest web development tutorials
×

JavaScript Tutorial

JavaScript Tutorial JavaScript Introduction JavaScript usage JavaScript Output JavaScript grammar JavaScript Statement JavaScript Notes JavaScript variable JavaScript type of data JavaScript Object JavaScript function JavaScript Scope JavaScript event JavaScript The string JavaScript Operator JavaScript Comparison JavaScript If...Else JavaScript switch JavaScript for JavaScript while JavaScript Break & Continue JavaScript typeof JavaScript Type conversion JavaScript Regular Expressions JavaScript error JavaScript debugging JavaScript Variable promotion JavaScript Strict mode JavaScript Use errors JavaScript Form validation JavaScript Keep the keyword JavaScript JSON JavaScript void JavaScript Code specification

JS function

JavaScript Function definition JavaScript Function parameter JavaScript Function call JavaScript Closure

JS HTML DOM

DOM Introduction DOM HTML DOM CSS DOM event DOM EventListener DOM element

JS Advanced Tutorial

JavaScript Object JavaScript Number JavaScript String JavaScript Date JavaScript Array JavaScript Boolean JavaScript Math JavaScript RegExp Object

JS Browser BOM

JavaScript Window JavaScript Window Screen JavaScript Window Location JavaScript Window History JavaScript Navigator JavaScript Pop-ups JavaScript Timing events JavaScript Cookies

JS Library

JavaScript Library JavaScript test jQuery JavaScript test Prototype

JS Examples

JavaScript Examples JavaScript Object instance JavaScript Browser object instance JavaScript HTML DOM Examples JavaScript to sum up

JS Reference Manual

JavaScript Object HTML DOM Object

JavaScript debugging

When writing JavaScript, if no debugging tool is a very painful thing.


JavaScript debugging

Debugging tools are not hard to write JavaScript programs.

Your code might contain syntax errors, logic errors, if no debugging tools, these errors are more difficult to find.

Typically, if the JavaScript error occurs, there will be no prompt, so you can not find the code wrong location.

Note Typically, you write an error occurs in a new JavaScript code process.

JavaScript debugging tools

Looking for the error in the program code is called debugging.

Debugging difficult, but fortunately, many browsers have built-in debugging tools.

Built-in debugging tools can be started or shut down, a serious error message will be sent to the user.

With debugging tools, we can set a breakpoint (stop position of code execution), and can detect when a variable code execution.

Enabled browser debugging tools are generally press the F12 key, and select the "Console" in the Debug menu.


console.log () method

If the browser supports debugging, you can use console.log () method prints JavaScript value on the debug window:

Examples

<! DOCTYPE html>
<Html>
<Body>

<H1> My First Web Page </ h1>

<Script>
a = 5;
b = 6;
c = a + b;
console.log (c);
</ Script>

</ Body>
</ Html>

try it"


Set a breakpoint

In the Debug window, you can set breakpoints JavaScript code.

On each breakpoint will stop executing JavaScript code to check the value of variables in JavaScript us.

After the inspection is completed, you can re-run the code (such as the Play button).


debugger keyword

debugger keyword to stop execution of JavaScript, and invoke the debugger functions.

This keyword and set a breakpoint in the debugging tool, the effect is the same.

If there is no debug available, debugger statement will not work.

Open debugger, code execution is stopped before the third line.

Examples

var x = 15 * 5;
debugger;
document.getElementbyId("demo").innerHTML = x;

try it"


The main browser debugging tools

Typically, browsers enable debugging tools are generally press the F12 key, and select the "Console" in the Debug menu.

Each browser, follow these steps:

Chrome browser

  • Open your browser.
  • Select Tools in the menu.
  • Select Tools Developer Tools.
  • Finally, select Console.

Firefox browser

  • Open your browser.
  • Access the page:
    http://www.getfirebug.com.
  • Follow the instructions:
    Install Firebug.

Internet Explorer browser.

  • Open your browser.
  • Select Tools in the menu.
  • Select Tools Developer Tools.
  • Finally, select Console.

Opera

  • Open your browser.
  • Opera's built-in debugging tools for the Dragonfly, a detailed description can be found on page visits:
    http://www.opera.com/dragonfly/.

Safari

  • Open your browser.
  • Right-click and select Inspect Element.
  • Select "Control Panel" at the bottom of the pop-up window.