在Javascript中动态创建表

时间:2014-05-31 21:40:57

标签: javascript html-table appendchild createelement

我有一个工作表,当按下按钮时,通过循环遍历数组并在每个单元格中显示该数据来动态创建表。

但是当我尝试为我的表添加表头时出现问题,我不确定我做错了什么。

Here is my current working code: (although doesn't seem to work in JSFiddle?!)

以下是我要添加的代码:(必定是错误的)

var thd=document.createElement("thead");
tab.appendChild(thd);

var tr= document.createElement("tr"); 
tbdy.appendChild(tr); 

var th= document.createElement("th");
th.appendChild(document.createTextNode("Name");
tr.appendChild(th);

非常感谢任何帮助,

1 个答案:

答案 0 :(得分:0)

您可以使用循环来避免重复代码。例如:

var columns = ["Name", "Age", "Degree"];

var thd = document.createElement("thead");
tab.appendChild(thd);

var tr = document.createElement("tr"); 
thd.appendChild(tr);

for (var i = 0; i < columns.length; i++) {
    var th = document.createElement("th");
    th.appendChild(document.createTextNode(columns[i]));
    tr.appendChild(th);    
}

演示:http://jsfiddle.net/ahEkH/6/