使用javascript动态创建表

Dynamic table creation using javascript

本文关键字：创建 动态 javascript 使用      更新时间：2023-09-26

我正在使用类似的东西来创建动态表

    for(var i=0;i<nrRows;i++){
        row=document.createElement('tr');
        for(var j=0;j<nrCols;j++){
        cell=document.createElement('td');
        cell.appendChild(document.createTextNode(i+' '+j))
        row.appendChild(cell);
        }
        tbo.appendChild(row);
    }

现在，我希望第一行填充列标题。我想给每一行中的每个文本框提供ID。我该怎么做？

"现在我想用列标题填充第一行。"

cell = document.createElement(i===0 ? 'th' : 'td');

"我想给每行中的每个文本框ID。"

什么文本框？您当前没有创建文本框。每个id属性都应该是唯一的，所以假设您实际上已经创建了一些文本框，您可以将id设置为i + "_" + j（类似于您已经为.createTextNode()设置的内容），这样代码的其他部分就可以轻松地计算访问任何特定单元格所需的id。

if(i == 0)
{
    cell = document.createElement('th');
}
else
{
    cell = document.createElement('td');
    var inputFld = document.createElement('input');
    inputFld.type = "text"; //input type = textfield
    var count=table.rows.length;
    inputFld.id = "NewTb" + count;
    cell.appendChild(inputFld);
}

if(i == 0)
{
    cell = document.createElement('th');
    //give column header names
}
else
{
    cell = document.createElement('td');
    var inputFld = document.createElement('input');
    inputFld.type = "text"; //input type = textfield
    inputFld.id = "input" + i;//assign id to input field
    cell.appendChild(inputFld);
}
相关文章：