Finding dynamiquement créé div

Question

Je souhaite modifier ma dynamique créé div mais je ne peux pas obtenir ce travail il est de continuer à créer de nouveaux divs

var div = document.getElementById('windowx'); 
var btn; 
var doc = content.document 

if (div) 
{ 
    div = document.getElementById('windowx') 
    div.innerHTML = "something new" 
} 
else 
{ 
    doc = content.document 
    div = doc.body.appendChild(doc.createElement("div")) 
    div.setAttribute("id", "windowx") 
    div.setAttribute("style", 
    "position: fixed; top: 100px; left: 100px; width: 20em;" 
    + "border: 2px outset orange; background-color: cornsilk;" 
    ) 
    btn = div.appendChild(doc.createElement("button")) 
    btn.setAttribute("style", "position: absolute; bottom: 1ex; right: 1ex;") 
    btn.setAttribute("onclick", "document.body.removeChild(this.parentNode)") 
    btn.appendChild(doc.createTextNode("Zamknij")) 
} 

Answer 1

Maintenant qu'il est clair qu'il est un plug-in Firefox:

document.getElementById recherchera cet élément dans l'interface utilisateur navigateur, pas la page Web. Mais plus tard, vous ajoutez l'élément à la page. Par conséquent, vous devez rechercher dans la page pour cet élément:

var div = content.document.getElementById('windowx'); 

Vous effectuez également des appels de méthode inutiles. Voici une version plus propre de votre code:

var doc = content.document, 
    div = doc.getElementById('windowx'), 
    btn; 

if (div) { 
    div.innerHTML = "something new" 
} 
else { 
    div = doc.body.appendChild(doc.createElement("div")) 
    div.setAttribute("id", "windowx") 
    div.setAttribute("style", 
    "position: fixed; top: 100px; left: 100px; width: 20em;" 
    + "border: 2px outset orange; background-color: cornsilk;" 
    ) 
    btn = div.appendChild(doc.createElement("button")) 
    btn.setAttribute("style", "position: absolute; bottom: 1ex; right: 1ex;") 
    btn.setAttribute("onclick", "document.body.removeChild(this.parentNode)") 
    btn.appendChild(doc.createTextNode("Zamknij")) 
} 

Answer 2

Pour moi, il étouffait sur content.document, l'objet de la fenêtre n » J'ai une propriété de contenu, donc je ne suis pas sûr de ce que vous référeniez. Nettoyé un peu et ça a l'air de marcher. Remarque J'ajoute directement le gestionnaire de clic au lieu de le définir en tant qu'attribut. Voir ici où je l'ai déclenché par un gestionnaire de clic bouton jQuery: http://jsfiddle.net/hN8uz/1/

var doc = document; 
var div = doc.getElementById('windowx'); 
var btn; 

if (div) { 
    div.innerHTML = "something new"; 
} 
else { 
    div = doc.body.appendChild(doc.createElement("div")); 
    div.setAttribute("id", "windowx"); 
    div.setAttribute("style", "position: fixed; top: 100px; left: 100px; width: 20em;" + "border: 2px outset orange; background-color: cornsilk;"); 
    btn = div.appendChild(doc.createElement("button")); 
    btn.setAttribute("style", "position: absolute; bottom: 1ex; right: 1ex;"); 
    btn.onclick = function() { 
     document.body.removeChild(this.parentNode); 
    }; 
    btn.appendChild(doc.createTextNode("Zamknij")); 
}