CODEWITHSUNDEEP
htmliframeinternet-explorer-10specifications
George Mauer
George Mauer

Reputation: 122052

Can't get same origin iframe body on IE10?

I've created a page with an empty iframe on it. I can then select the iframe document and navigate to it's body:

var iframe = document.getElementsByTagName('iframe')[0];
var doc = iframe.contentDocument || iframe.contentWindow.document;
var body = doc.body;
console.log("Body is", body);

In firefox and chrome this gives me the body object. In IE10 it gives me null.

Here is a Jsbin demonstrating the issue. Open up the JS, Console, Output panels and click "Run With JS".

Two questions:

  1. How do I get access to the iframe's body in a cross-browser manner?
  2. Which is the correct "to-spec" behavior?

Upvotes: 2

Views: 2894

Answers (3)

George Mauer
George Mauer

Reputation: 122052

Over a year later but I believe the solution was to call

doc.open()
//make any modifications
doc.close()
//at this point doc.body will not be null

This made things work in a fairly consistent manner cross browser

Upvotes: 0

Christophe
Christophe

Reputation: 28114

This code is working for me cross-browser:

var doc=ifr.contentWindow||ifr.contentDocument;
if (doc.document) doc=doc.document;
var body=doc.getElementByTagName("body")[0];

Upvotes: 0

Magnus Jacobsen
Magnus Jacobsen

Reputation: 61

I had a similar problem earlier today. It seems IE, at least 9 and 10, doesn't create the iframe body correctly (when I used the developer tools I was able to see a body tag inside the iframe, but like you wasn't able to call it), when there's no specified src. It gives you null cause it doesn't exist.

The answer, to whether there is a cross browser manner to access the iframe's body, is no. BUT, you could use a workaround. First, check if the iframe body exist, if not, then create it.

Your code would look like this:

var iframe = document.getElementsByTagName('iframe')[0];
var doc = iframe.contentDocument || iframe.contentWindow.document;

// The workaround
if (doc.body == null) {       // null in IE
    doc.write("<body></body>");
}

var body = doc.body;
console.log("Body is", body);

Source: http://forums.asp.net/t/1686774.aspx/1

Upvotes: 6

Related Questions