JS实现向表格中动态添加行的方法
2015-04-01来源:易贤网

这篇文章主要介绍了JS实现向表格中动态添加行的方法,涉及javascript针对表格行的动态添加技巧,具有一定参考借鉴价值,需要的朋友可以参考下

本文实例讲述了JS实现向表格中动态添加行的方法。分享给大家供大家参考。具体分析如下:

下面的JS代码通过表格对象的insertRow方法动态向表格的最顶端添加新的行

<!DOCTYPE html>

<html>

<head>

<script>

function insRow()

{

var x=document.getElementById('myTable').insertRow(0);

var y=x.insertCell(0);

var z=x.insertCell(1);

y.innerHTML="NEW CELL1";

z.innerHTML="NEW CELL2";

}

</script>

</head>

<body>

<table id="myTable" border="1">

<tr>

<td>Row1 cell1</td>

<td>Row1 cell2</td>

</tr>

<tr>

<td>Row2 cell1</td>

<td>Row2 cell2</td>

</tr>

<tr>

<td>Row3 cell1</td>

<td>Row3 cell2</td>

</tr>

</table>

<br>

<input type="button" onclick="insRow()" value="Insert row">

</body>

</html>

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

更多信息请查看IT技术专栏

2025公考·省考培训课程试听预约报名

  • 报班类型
  • 姓名
  • 手机号
  • 验证码
推荐信息