Javascript For循环使用InnerHTML和事件处理程序创建DOM元素不'；行不通

我遇到了一个非常奇怪的问题，我有一个解决办法，但实际上不知道为什么会发生

本质上，我获取一个现有的DOM元素，使用innerHTML创建append DOM元素，然后为它的onclick事件放入一个事件处理程序

for(i=0; i<contextMenuModel.length; i++) {
    contextMenuRow = contextMenuModel[i];
    currentRowId = "edit_context_table_row_" + i;

    editTable.innerHTML += "<div id='" + currentRowId + "'></div>";
    row = dojo.byId(currentRowId);

    row.innerHTML += "<span>" + contextMenuRow.labelName + "</span>";
    row.innerHTML += "<span>" + contextMenuRow.eventName + "</span>";

    dojo.connect(row, "onclick", row, rowClickHandler);
}

此外，如果我取出：

row.innerHTML += "<span>" + contextMenuRow.eventName + "</span>";

row.innerHTML+=“”+contextMenuRow.eventName+“”；

它仍然不起作用

然而，我发现的解决方法（这使这一切变得更好）是这样的：

for(i=0; i<contextMenuModel.length; i++) {
    contextMenuRow = contextMenuModel[i];
    currentRowId = "edit_context_table_row_" + i;

    editTable.innerHTML += "<div id='" + currentRowId + "'></div>";
    row = dojo.byId(currentRowId);

    row.innerHTML += "<span>" + contextMenuRow.labelName + "</span>";
    row.innerHTML += "<span>" + contextMenuRow.eventName + "</span>";
}

for(i=0; i<contextMenuModel.length; i++) {
    row = dojo.byId("edit_context_table_row_" + i);
    dojo.connect(row, "onclick", row, rowClickHandler);
}

---

（i=0；i的

问题就在这里。当我这样做时：

editTable.innerHTML += "<div id='" + currentRowId + "'></div>";

editTable.innerHTML+=”；

我正在连接然后替换旧的innerHTML。这意味着生成了一个新的DOM节点；这个新的DOM节点没有连接到旧的事件处理程序。这使得旧的事件处理程序无所事事。更不用说代码正在创建和丢弃所以许多DOM节点，这段代码是真实的非常糟糕。
我发现，当动态创建元素并将事件附加到元素上时，使用
document.createElement
通常效果会更好。这可以确保将元素添加到dom中，并且您可以使用一个对象，而不是连接字符串

   var divRow = document.createElement("DIV");
   divRow.id = currentRowId;
   divRow.onclick = function(){};
   editTable.appendChild(divRow);

除非有更好的。我两天内不能接受。如果有人提出更好的解释或解决方法，我会接受。那就按我的方式扔支票吧。
   var divRow = document.createElement("DIV");
   divRow.id = currentRowId;
   divRow.onclick = function(){};
   editTable.appendChild(divRow);