How to Write to the IE8 Console
For a developer, the ability to trace a JavaScript program's execution is a very valuable skill. Debugging JavaScript often requires programmers to display diagnostic information in alert boxes or write it to Web page elements such as div containers. IE8 simplifies the debugging task by providing a console you can use to view diagnostic information as your program runs.
Other People Are Reading
Instructions
-
-
1
Launch your HTML editor and open one of your HTML Web documents.
-
2
Add this code to the document's "<body>" section to create a button:
<input id="Button1" type="button" value="Write to Console" onclick="return WriteToConsole()" />
This button calls a JavaScript function named "WriteToConsole."
-
-
3
Paste the following JavaScript function in the document's "<script>" section:
function WriteToConsole( ) {
var message = "Testing";
console.log(message);
console.info(message);
console.warn(message);
console.error(message);
var a = 0;
var b = 10;
console.assert(a == b, "a does not equal b");
}
This function writes five different types of console messages to IE8's console. The "console.log" command writes the value stored in the "message" variable to the console. That value is "Testing." The next three commands also write "Testing" to the console. However, the "console.info" command places a blue icon next to the text, "Console.warn" displays a yellow icon and "console.error" shows a red one. The "console.assert command," shown on the last line, is a conditional statement. It writes to the console only if a condition is true. In this example, it compares the value of "a" to "b." If the condition is true, the command does not write anything to the console. Otherwise, it writes "a does not equal b" to the console. The "console.assert" command is useful for displaying console output only when there are specific conditions that interest you.
-
4
Save the document and open it in IE8. The Web page shows the button you created.
-
5
Press "F12." A new IE8 window opens. This is the "Developer Tools" window. Click the "Script" button, then click "Console" to activate IE8's console.
-
6
Minimize the "Developer Tools" window so that you can see the Web page containing the button; click that button. The JavaScript function runs and writes "Test" to the IE8 console.
-
7
Maximize the "Developer Tools" window. The first four console commands write the word "Testing" to the console. Blue, yellow and red icons appear next lines two, three and four. The fourth line displays "a does not equal b" because the condition in the "console.assert" command, "a == b," evaluates to false.
-
1
Tips & Warnings
By using the appropriate info, warn or error console command, you can quickly spot different types of console output statements. For instance, if your code issues a "console.error("Problem")" command, you can simply scan through the console output and look for red icons.
You must press "F12" to open the Developer Tools window before running any code that writes to it. If you launch the Web page created in this example and click the button before opening the Developer Tools window, an error message appears.
References
Resources
- Photo Credit Stockbyte/Stockbyte/Getty Images
