基于JavaScript实现动态创建表格和增加表格行数

在工作，项目需求中，有时候表格的行数不能够满足我们的需求，这时需要我们动态的增加表格的行数，下面小编通过一段代码实例给大家介绍js创建表格和增加表格的行数的方法，并且还实现了隔行变色功能。对此感兴趣的朋友可以参考一下代码：

js代码如下所示：

<！DOCTYPE html><html><head><meta charset="utf-8"><title>动态操作表格</title></head><body><script type="text/javascript">var n = 0;function showTable（len） { wi（"<table border="1" width="300" style="border-collapse:collapse"><tbody id="table">"）; for （i=0;i<len;i++）{ if （parseInt（i%2）==1） {bg = "#F4FAC7"; } else {bg = "white";} wi（"<tr bgcolor="+bg+"><td>第"+（i+1）+"行</td></tr>"）;} wi（"</tbody></table><br />"）; wi（"<input type="button" value="Add" id="add" />"）; }</P><P>function wi（str） { return document.write（str）; }showTable（10）;var add = document.getElementById（"add"）; add.onclick = function（） { n = n+1; if （n%2==0）{ bg = "#F4FAC7"; }else{ bg = "white";} var table = document.getElementById（"table"）; var tr = document.createElement（"tr"）; tr.bgColor = bg; var td = document.createElement（"td"）; td.innerHTML = "第"+（10+n）+"行"; tr.appendChild（td）; table.appendChild（tr）;}</script></body></html>

以上内容是基于JavaScript实现动态创建表格和增加表格行数的相关代码，希望大家喜欢。