Question

I have Html Layout Similar to this :

Parent Page > iFrame

I want to write dynamic iframe & content so the layout should look similar to this :

Parent > iFrame > Write New iFrame & It’s Content

I’m able to write html content for child iframe using this code

Parent Page > iFrame > Hello World!

var ifrm = document.getElementById('myIframe');
ifrm = (ifrm.contentWindow) ? ifrm.contentWindow : (ifrm.contentDocument.document) ? ifrm.contentDocument.document : ifrm.contentDocument;
ifrm.document.open();
ifrm.document.write('Hello World!');
ifrm.document.close();

but How can I write same content inside :

Parent Page > iFrame > iFrame > Hello World ?

All iFrames are on same Domain.

Answer 1

var ifrm = document.getElementById('myIframe');
ifrm = (ifrm.contentWindow) ? ifrm.contentWindow : (ifrm.contentDocument.document) ? ifrm.contentDocument.document : ifrm.contentDocument;
var childfrm = ifrm.document.createElement('iframe');
childfrm.id = 'myChildIframe'; // repeat for any other properties you need
ifrm.document.body.appendChild(childfrm); // or use insertBefore to add it somewhere specific within the DOM
var childwin = (childfrm.contentWindow) ? childfrm.contentWindow : (childfrm.contentDocument.document) ? childfrm.contentDocument.document : childfrm.contentDocument;
childwin.document.open();
childwin.document.write('Hello World!');
childwin.document.close();

(This is untested, but I think it’ll work)