Which tools do you use to debug HTML/JS in your browser?

Question

I\'d like to collect the best debugging aids for all browsers out there. So that would probably be Firebug for Firefox but what do you use for IE? Safari? Opera? Opera Mini?

Answer 1

I suggest to use a DIV with the id="debug" and then add text to it for debugging. That allows you to overlay the HTML with the debug output and it doesn't block the flow of the app. Use a z-index to make sure it stays on top and give it transparency so you can see through it. See this answer for the CSS.

Or open a new window and append your debug messages there.

You can use this with nested DIVs to implement full-fledged logging. Have a look at this article on A List Apart and at log4js to get some ideas.