Firefox not able to find iframe

Question

This is the iframe I'm trying to access:

 <div class="mceBody" id="additionalTxt_b">
        <iframe frameborder="0" id="additionalTxt_f" src='javascript:""' class="punymce"/>
 </div>

Using this line:

frames['additionalTxt_f'].document.getElementsByTagName("body")[0].innerHTML

For some reason I'm getting "frames.additionalTxt_f is undefined" from firebug. I have similar iframes (dynamically created by punyMCE plugin) on other pages, and they work perfectly fine. And IE7/8 has no problem accessing this iframe either.

Just at a complete loss here. Any ideas on why Firefox can't find the iframe?

Answer 1

The window.frames[] array is indexed by the [i]frame's name attribute (aka frame target). id can't be relied upon to also work — although it may in IE <8, which often thinks names and ids are the same thing.

If you want to access a frame's content via ID, use the DOM Level 2 HTML contentDocument property instead of the old-school (“DOM Level 0”) frames array:

document.getElementById('additionalTxt_f').contentDocument.body.innerHTML

...but then, for compatibility with IE <8, you also have to add some fallback cruft, since it doesn't support contentDocument:

var f= document.getElementById('additionalTxt_f');
var d= f.contentDocument? f.contentDocument : f.contentWindow.document;
d.body.innerHTML

So it's up to you which method you think is less ugly: the extra script work, or just using the name attribute.

Answer 2

if you have only 1 iframe you can also find it with window.frames[1] or document.getElementsByTagName('iframe')[0]

(In the first option, the parent window is #0)