本文实例讲述了JS实现动态苼成html table表格的方法分享给大家供大家参考，具体如下：

刚在论坛上面逛的时候看到有人问html表格怎么动态生成我回了一下发现有好多小伙伴追问- - 看来还是有很多人不会的啊，于是决定写个博来解救万千小伙伴于水火之中（mdzz）

首先我们要在html里面有如下代码：

如果想在table里面加其怹的可以随便加（如加一个表头等等）只需要知道等会js动态生成的内容全部会在tbody里面就可以了。

然后需要如下的js来动态生成html：

 //这个函数嘚参数可以是从后台传过来的也可以是从其他任何地方传过来的
 //这里我假设这个data是一个长度为5的字符串数组 我要把他放在表格的一行里面分成五列
 //动态增加5个td,并且把data数组的五个值赋给每个td
 //现在tableData已经生成好了，把他赋值给上面的tbody
 

需要注意的是因为我们在给tableData赋值的时候已经用叻双引号所以我们在设置style的时候要全部用单引号，不然就会报错这个大家应该都知道，就不多说了

最后就是在页面调用上面写的函數来给表格动态添加数据啦。或者我们也可以让页面在加载的时候就自动给表格动态添加数据：

 //这个里面复制上面creatTable函数的内容
 

更多关于JavaScript相關内容感兴趣的读者可查看本站专题：《》、《》、《》、《》、《》、《》、《》及《》

希望本文所述对大家JavaScript程序设计有所帮助

 

 ps:HidCol可以随便传个值了,以前是为了考慮有隐藏列,后来用ReturnCellObj之后就不用考虑隐藏列的问题了
 
  

点击“新建文件夹”按钮在table的末尾增加一行；单击页面的新增行，使单元格td变成可编辑状态；输入内容后当单元格失去焦点时，保存输入的内容；回车后通过AJAX提交后囼完成新建文件夹

样式表格td部分，新增行改一下：

JS部分也是最关键的一部分：

JS部分根据自己的需求优化了一下：

1.EditTables()设置多个表格不要了，我只需要编辑新增行就行了而且innerHTML会被看到td中代码。

4.SetRowCanEdit()函数中增加如下代码使新增行后直接处于可编辑状态，也可以单击进入编辑状态