javascript - iframe not rendering in ie9 mode when containing page is in quirks mode

Question

I have an iframe in a page that runs in quirks mode (I don't have control over the containing page), and I need my page to render in a mode that is compatible with modern browser features.

The contained page makes heavy use of newer JavaScript features (especially the nice array functions), and SVG rendering. While I can shim the array functions easily enough, I can't force the svg to render.

To be clear, the inner page is NOT running in quirks mode - I have specified a doctype and the ie=edge < meta > tag. It looks like it's using the ie8 rendering mode (hard to be certain)

A sample of the issue is here: http://stevesspace.com/quirks/quirks.html - load it up in chrome to see the expected output, and check it in IE9 or 10 for the actual output.

EDIT: I've added the document mode and compatibility mode to the sample, I can confirm it's using IE8 doc mode.

Answer 1

I ended up using an object tag instead of an iframe, it seems to work ok across modern browsers.

<object type="text/html" data="http://example.com"></object>

It turns out you can't modify the URL using javascript in IE9, but that's not a big deal - removing/adding a new object element works just as well for this.

Update: This tag can also be in an intermediate page that the iframe points to and it all works fine Update 2: This solution does not work in IE10