These postings are provided "AS IS" with no warranties, and confers no rights. You assume all risk for your use.
Frédéric HarperDeveloper Evangelist
Admit it, you’ve done it. You have a bug somewhere in your web page and you add an alert to popup a useful message like “I am in the if statement” or “varName=Bob” to help you figure out what is wrong with your code. In IE9 we have an alternative: the Console object.
ASP.NET programmers who work in Visual Studio may already be familiar with the debug object. You call methods of the debug class in your .NET code to display messages in the Output window to help you debug your code in Visual Studio. The Console object is the IE9 equivalent.
Hopefully you have already discovered the Developer tools in IE8 and IE9. If not, just open your browser and go to a website, any website will do. Now hit F12. This will bring up the developer tool window. Now go to the Console tab.
Now try typing console.log(“Hello world”) in the console command line at the bottom of the window. Your output should look something like this.
console.log will display the parameter passed to the log method in the console window. Use this method to display a string or variable in the console window.
Keep in mind you will not be able to see the output unless you have the developer tools open. You can see the console output on either the Console or Script tabs. Be careful when using console for debugging. If you leave a call to the console object in your code when you move to production and you do not have the developer tools displayed you will get an error message telling you console is undefined. You will get the same error in Visual Studio if you Start without debugging.
To avoid the error message, you either need to remove all the console method calls from your code, or you need to add a check to make sure console exists before calling any methods. For example:
Now that you understand the the basics, let’s look at the different methods available with the console class.
log(message[,object]) – the Log method accepts one or more parameters and displays them in the output window. It also accepts format strings.
warn(message[,object]) – accepts one or more parameters and format strings just like the log method, but displays the output with a warning icon.
info(message[,object]) – will display an information icon beside the output
error(message[,object]) – will display an error icon beside the output
clear() – will clear the console output window
dir(object) –is an object inspection method that will list all the properties of an object
assert(expression, message[,object]) - will display the message or object contents if the expression is false
var debugging=false; console.assert(debugging,"You are not debugging");
So there you have it, more tools to help you debug your web pages. No add-ons or extra software required. Just download IE9 and try it for yourself!
Since we are already playing around in the developer tools that brings me to today’s My 5
My 5 Cool Features in the F12 Developer Tools (in no particular order)