如何使用JS脚本添加表格的行和列

<table border="1">

<tbody id="new">

<tr><td>a</td><td>1</td></tr>

<tr><td>b</td><td>2</td></tr>

<tr><td>c</td><td>3</td></tr>

</tbody>

</table>

<script type="text/javascript">

var table = document.getElementById("new")

// 增加行

var newTR= document.createElement("tr")

var newTD1 = document.createElement("td")

var newText1 = document.createTextNode("d")

var newTD2 = document.createElement("td")

var newText2 = document.createTextNode("4")

newTD1.appendChild(newText1)

newTD2.appendChild(newText2)

newTR.appendChild(newTD1)

newTR.appendChild(newTD2)

table.appendChild(newTR)

//增加列

var tr = table.getElementsByTagName("tr")

for(var i=0i<tr.lengthi++) {

var newTD = document.createElement("td")

var newText = document.createTextNode(i)

newTD.appendChild(newText)

tr[i].appendChild(newTD)

}

</script>

比如设置table的id为tab

var trHTML = "<tr><td>...</td></tr>"

$("#tab").append(trHTML)//在table最后面添加一行

$("#tab tr:eq(2)").after(trHTML)// 在table的第3行后面添加一行

这样就可以进行动态的添加行了，至于你是通过什么事件来动态添加那就看你自己的意思了，通过button或者div之类的点击事件添加，只要把上面的两行代码放进去就ok，注意，要把var trHTML那行代码放进添加事件里面，不然不管点击多少下，都只能添加一行

$(function() {

$(":button").click(function() {

var tr = "<tr><td>new</td></tr>"

//$("table").append(tr)

$("table tr:eq(2)").after(tr)

})

})

这是我测试用的代码，你可以运行看看

js如何在table中插入一行的方法是定位，插入：

1、通过id定位到myTable对象

var table = document.getElementById("myTable")

2、创建一个空的<tr>标签，并且插入到第一行：

var row = table.insertRow(0)

3、插入两列：

var cell1 = row.insertCell(0)

var cell2 = row.insertCell(1)

4、给列分别赋值：

cell1.innerHTML = "NEW CELL1"

cell2.innerHTML = "NEW CELL2"

---