Javascript - how to change content of elements inside page when using iframes using dom and not jquery

I have this iframe and as you can see it calls a js function with an onload trigger.

<iframe name="top" id="top" width="99%" height="20%" src="top.htm" frameborder="0" scrolling="no" onload="log_in()"></iframe>

      

What I need to do is create an element inside "top.htm" (change innerHTML and the like) from this function.

But the problem is that funnction does not recognize the elements of the "top.htm" page, but only those specified in index.htm (the page with frames).

ps i have to use DOM and i have to use iframes.

Does anyone know how to do this?

10x: -)

+2


a source to share


2 answers


For example, accessing all dom elements:

document.getElementById("top").contentWindow.document.getElementsByTagName("*")

      



It's your problem?

+2


a source


Iframe and its document

Links to the window generated by the iframe and to the document loaded in the iframe can be obtained through the frames array using the name attribute.

window.frames[iframeName]
window.frames[iframeName].document

      

The summarization array method has wide support even among fairly old browsers as long as you attach the name attribute to the iframe. For best results, use a name and ID.

For more modern browsers, the document inside an iframe can also be referenced using the contentWindow (IE win) and contentDocument (DOM) properties of the iframe element:



// IE5.5+ windows
document.getElementById(iframeId).contentWindow
document.getElementById(iframeId).contentWindow.document

      

or,

// DOM 
document.getElementById(iframeId).contentDocument

      

from http://www.dyn-web.com/tutorials/iframes/

here: http://www.dyn-web.com/tutorials/iframes/refs.php

+2


a source







All Articles