一个发现动态创建的div

Question

我想改变我的动态创建的div ，但我不能得到这个工作 它不断创造新的div

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

现在，很显然这是一个Firefox插件：

document.getElementById将在浏览器的用户界面，元搜索，而不是网页。但是稍后您将该元素添加到页面中。因此，你必须在网页中搜索该元素：

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

而且，你在做一些不必要的方法调用。以下是您的代码的更清晰版本：

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

对我来说是窒息content.document，window对象没有按”没有内容属性，所以我不确定你在引用什么。清理了一下，它似乎工作。注意我直接添加click处理程序，而不是将其设置为属性。看到这里，我有它触发了一个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")); 
}