Add dynamical elements in a Iframe element than i create

Question

Hi, i have a litle problem if i create a dynamically IFRAME element and i agregate dynamically elements to the new iframe. It works If i do that:

var miiframe=document.getElementById("miiframe");
var myElement=content.document.createElement("LABEL");
myElement.innerHTML="blabla";
miiframe.contentDocument.body.appendChild(myElement);

but if i do that doesn't works:

var miiframe=content.document.createElement("IFRAME");
miiframe.src="about:blank";
document.body.appendChild(miiframe);
var myElement=content.document.createElement("LABEL");
myElement.innerHTML="blabla";
miiframe.contentDocument.body.appendChild(myElement);

i see the iframe but i don't see the label element. The most courious is if before appendElement i do and alert it works!!!

var miiframe=content.document.createElement("IFRAME");
miiframe.src="about:blank";
document.body.appendChild(miiframe);
var myElement=content.document.createElement("LABEL");
myElement.innerHTML="blabla";
alert("now works!!!");
miiframe.contentDocument.body.appendChild(myElement);

With DIV element works but i want do that with IFRAME element!!!

This code is for Firefox. Thanks!!

Answer 1

If you put a "src" to your iframe, it tries to load this source (even if it is a "about:blank"). After the loading is done, it overwrites your label. You can add a listener to wait for the iframe loading:

var miiframe=content.document.createElement("IFRAME");
miiframe.src="about:blank";
miiframe.addEventListener('load', function (e) {
    var myElement=content.document.createElement("LABEL");
    myElement.innerHTML="blabla";
    miiframe.contentDocument.body.appendChild(myElement);
}, false);

document.body.appendChild(miiframe);