innerHTML 与 appendChild 有啥区别？求前端解答。

This topic created in 3995 days ago, the information mentioned may be changed or developed.

背景：通过js创建table 然后按照bootstrap的样式设置下table。最后在加入div节点中去。

发现用appendChild 将table 加入div节点后页面样式没有显示
但是用innerHTML 的时候就显示了～。

并且我疑惑的是我alert出来 table的 html 直接粘贴在页面上还能显示~　为啥ｊｓ构建的就不能显示呢？　求前端解答。　

代码如下：

function buildOpenTask(data)
{   /*
var formId = data.formId;
var formTitle = data.formTitle;
var publicDataElementId = data.publicDataElementId;
var firstNode = data.firstNode;
*/
var childList = data.childList;
var _table = document.createElement("table");
_table.className = 'table table-condensed';
for (var i = 0; i < childList.length; i++) {
    var _tr = document.createElement("tr");
    var _td_title = document.createElement("td");
    var _td_input = document.createElement("td");
    _td_title.className = 'info';   
    _td_title.innerHTML = childList[i].dataElementAlias;
    //alert(childList[i].dataElementAlias);

    _tr.appendChild(_td_title);
    _tr.appendChild(_td_input);
    _table.appendChild(_tr);
}
//document.getElementById("openTask").appendChild(_table.);
document.getElementById("openTask").innerHTML = _table.outerHTML;
}

var

table

innerHTML

4 replies • 2015-06-30 21:55:09 +08:00