javascript document.getElementById in other frames

Question

I have two frames and want to access an element in one frame from another:

Frame 1:

<div id='someId'>...</div>

Frame 2:

var div=document.getElementById('someId');

div.innerHTML='something'; 

This is somehow not functioning in Firefox so I want to be sure, can I access an element in another frame by its ID?

Straightaway

Answer 1

You can refer the other frame by using

window.frames["framename"]

and then you can refer the element in the DOM by using

window.frames["framename"].document.getElementById ( "yourelementid" );

Thundercloud

so, there is no option that browser would find first available element with desired ID no matter in which frame that reside ? – Straightaway

@as: getElementByid is restricted to looking in the document object of which it is a method. Bear in mind that a frame is in fact a separate window object, and an examination of the window->document hierarchy should make it clear why a method on one document cannot examine a document in a different window. – Nonproductive

It's not wirking in chrome, window.frames['framename'].document has nothing inside it. I mean windows.franes['framename'].ducumnet.getElementById(...)... results Uncaught TypeError: Cannot call method 'getElementByName' of undefined error. – Estus

This doesn't work for me, The answer from @Brian Duncan do! – Sexlimited

Answer 2

The issue may be the current frame you are in. If window.frames['framename'] does not work, try parent.frames['framename'] to access the top level frames.

if(parent.frames && parent.frames['framename']) {
   var elem = parent.frames['framename'].document.getElementById(...); 
   // etc
}

Vidavidal

Answer 3

I was having problem with the JS version but was able to use these examples for a working jQuery version:

var obj = $('#yourelementid', parent.frames["framename"].document);

Willette

Answer 4

document.getElementById('frameId').contentDocument.getElementById('frameChild');

Weinstock

Answer 5

Or, if you feel like trying your luck, you can just use a numeric parameter.

window.frames[0].document

Donettedoney

Answer 6

For some reason

window.frames["framename"].document.getElementById ( "yourelementid" );

was not working for me.

This other method did:

   document.getElementById('framename').contentWindow.document.getElementById('yourelementid');

Fimble

Answer 7

Simply use frameId.MyElementId

Of course, when defining your frame, not enough to use "name=....", rather use "id=..." within your frame tag. E.g.:

    <iframe id=MyFrame> .... 
          <input id=MyElementId>
               ...

    <script>
       // do something with MyElementId
           MyFrame.MyElementId.value = "something";

At least, it works as of 2022 (almost 2023).

[Note that I didn't even use "name"... that's quite not necessary by these days, unless you want to use radio buttons with multiple <INPUT's that refer to the same mutually exclusive element]

Supercilious