Testing IE7 & IE8 using IE9 developer tools - Right document mode to replicate the old versions?_问答_开发者

I'm building a site with HTML5 elements and would just prefer it if previous versions of IE would play along, so i'm using the HTML5shim javascript from googlecode.

The only way I have to test IE7 and IE8 is to use the developer tools on IE9 to switch the browser mode and document mode.

Even using the shim, if I select IE7 or IE8 brow开发者_JS百科ser mode and their relevant standards mode, the document is pretty far gone - HTML5 elements do not behave like div's (i'm under the impression that shim replaces all the new elements with divs).

If I select quirks mode for the IE7 and IE8, the site looks more or less how it should, which gives me hope that I can fix any remaining issues without having to resort to stripping out HTML5 elements.

So if you're using IE7 or IE8 with a HTML5 doctype, would they run in quirks or standards?

Also, can I trust that what i'm seeing in IE9 emulating the old versions is what a user of the older browsers would actually see?

i'm going to stick out my neck and say NO. you can’t trust IE9 emulating old versions.

I’ve recently ran into some issues regarding IE9 emulating IE8 using X-UA-Compatible IE=EmulateIE8 to force IE8 rendering via IIS. I must say everything was fine until i upgraded to Jquery 1.6.1 from Jquery 1.4.3. I started getting some wierd issues with Jquery selecting DOM objects using $("#myObject");

but visually everything looks fine tho but there's something not well with IE9's DOM. before upgrading to IE9 all worked fine, maybe the test would be to downgrade to IE8 again test if Jquery 1.6.1 works. but from my experience i dont think you can trust IE9 emulating old browsers, best thing is to setup a VM with old browsers that will give you better results. i'm going to do that, rather use VM with old browser (IE8).

Update

I went the VM route way, much easier to test IE8 that way, so all I did was setup a VM with IE8 installed.

Remember to set display:block on those elements. A rule like:

article, aside, figure, footer, header, hgroup, nav, section {display: block;}

In your CSS will help.

The compatibility modes in IE8 and IE9 are intended to allow you to do exactly what you're asking -- to test your site for all IE versions while only having a single version of IE on your machine.

It's a great idea in principle. Unfortunately, microsoft messed it up. While the compatibility modes do indeed replicate IE7 and IE8, they also have their own bugs and issues which do not occur either in the parent browser nor in the browser they are attempting to emulate.

In effect, the compatibility modes are actually another set of different browsers. You can't rely on them to accurately show you what your site looks like in IE7, but at the same time you do still need to test with them in case you have users who are running in compatibility mode for whatever reason.

You also asked about quirks mode and standards mode. Please note that "quirks mode" has nothing whatever to do with compatibility mode.

Quirks mode is triggered in IE by a site not having a <!DOCTYPE> declaration at the top of the page. This was introduced when standards mode was brought out with IE6, to allow sites to continue working in older versions of IE. Quirks mode is therefore effectively an IE5 compatibility mode. There is absolutely no reason to be using quirks mode in any site today, so you should always specify a doctype (preferably the HTML5 doctype). If your site looks good in quirks mode, and not in standards mode, then you need to fix your site.

The HTML5 doctype <!DOCTYPE html> will trigger standards mode in all versions of IE, from IE6 and up. In fact, this doctype was deliberately chosen by the HTML5 standards team specifically because it was the shortest possible doctype that would work in all existing browsers.

About the HTML5Shim: I had some trouble getting the basic shim to work. I never tracked down the problem, but I resolved it by using Modernizr instead. This has the same functionality as the basic shim, plus a bunch of other useful features for browser compatibility checking.

Your impression of what the shim does is slightly wrong: it doesn't replace elements with divs. What it actually does is create dummy versions of each of the new HTML5 elements, using Javascript. This exploits a quirk in IE whereby it recognises an element as valid HTML if an instance of it has been created via Javascript. (It's a bizarre quirk, but it's proved useful for the hackers to force IE to accept modern standards.

Hope that helps.

My answer to ie7 / ie8/ ie9 testing is to use VirtualBox from Sun Oracle. It works great on Windows, Mac and Ubuntu! It contains real images of Windows boxes and IE versions.

https://www.virtualbox.org/wiki/Downloads

http://osxdaily.com/2011/09/04/internet-explorer-for-mac-ie7-ie8-ie-9-free/

This has been incredibly useful to me in my job for testing older versions.