JavaScript动态添加表格行（使用模板、标记）

在客户端使用JavaScript动态添加表格行，先到网上找了相关的资料，发现有现成做好的组件，发现它只能够满足比较简单的要求，对于复杂的操作情况，比如：添加一行之后，在这一行上还要进行相关的操作会显得有些吃力；本人比较喜欢表现层使用模板、标记填充数据的做法，于是自己做手做了个小组件，与大家一起分享。

组件运行截图：

图片看不清楚？请点击这里查看原图（大图）。

图片看不清楚？请点击这里查看原图（大图）。

设计思路：

在Table的thead中加入一行隐藏的行，当要添加一行时，复制一次隐藏的行，再将实例数据填充到这一行中相应的位置，填充完毕之后，再将这一行加到表格中去，整个操作完成。

模板：隐藏的行即相当于模板，当需要时复制一次模板。

标记：将模板行复制出来后，该如何填充数据？

网上比较多的组件的做法是，传递进来两个数组，一组是元素名称列表，一组是对应的值列表，然后对复制出来的行进行一个查找，发现其中的元素的名称在元素名称列表中的，让其value=对应的值。这样做可以满足一般的需求，因为Table里面一般放置文本框，将值放到其中即完成任务。对于复杂的情况，要求将数据填充到其它的位置，这种方法就力不从心了。