How to detect Render Mode of browser for current page?

Question

I know that modern browsers generally have two render mode: standard mode and quirk mode. The browser detects the heading DocType.

The question is how to detect render mode of current page at runtime. Is there any Firebug tool to do that?

Answer 1

Before IE8:

alert('Page was rendered in ' +
  ((document.compatMode == 'CSS1Compat') ? 'Standards' : 'Quirks') + ' Mode.');

For IE8:

var vMode = document.documentMode;
var rMode = 'IE5 Quirks Mode';
if(vMode == 8){
  rMode = 'IE8 Standards Mode';
} else if(vMode == 7){
  rMode = 'IE7 Strict Mode';
}
alert('Rendering in: ' + rMode);

Be aware that to gain the benifits of IE8's new "standards mode by default" behavior you'll need to be rendering in IE8 Standards Mode.

This mode affects the rendering of your HTML+CSS as well as the fixes to JavaScript methods like document.getElementById( id ); and .setAttribute( name, value );

Answer 2

You should also have a look at jQuerys jQuery.support . It will tell you what standards are supported by the browser (boxModel, opacity, etc.)

http://docs.jquery.com/Utilities/jQuery.support

i.e.

jQuery.support.boxModel; //false in IE when in quirksmode, true otherwise.