JS动态添加Table的TR,TD实现方法_Javascript教程-查字典教程网
JS动态添加Table的TR,TD实现方法
JS动态添加Table的TR,TD实现方法
发布时间:2016-12-30 来源:查字典编辑
摘要:本文实例讲述了JS动态添加Table的TR,TD实现方法。分享给大家供大家参考。具体实现方法如下:复制代码代码如下:vartempRow=0...

本文实例讲述了JS动态添加Table的TR,TD实现方法。分享给大家供大家参考。具体实现方法如下:

复制代码 代码如下:<html>

<head>

<title></title>

<SCRIPT language="JavaScript">

var tempRow=0;

var maxRows=0;

function insertRows(){

tempRow=table1.rows.length-1;

maxRows=tempRow;

tempRow=tempRow+1;

var Rows=table1.rows;//类似数组的Rows

var newRow=table1.insertRow(table1.rows.length);//插入新的一行

var Cells=newRow.cells;//类似数组的Cells

for (i=0;i<2;i++)//每行的7列数据

{

var newCell=Rows(newRow.rowIndex).insertCell(Cells.length);

newCell.align="center";

switch (i)

{

case 0: newCell.innerHTML="<td valign='top'>corpName</TD>"; break;

case 1 : newCell.innerHTML="<td valign='top'><a href='javascript:delTableRow(""+tempRow+"")'>删除</a></TD>"; break;

}

}

maxRows+=1;

}

function delTableRow(rowNum){

if (table1.rows.length >rowNum){

table1.deleteRow(rowNum);

}

}

</SCRIPT>

</head>

<body>

<form action="">

<table border="0" cellspacing="0" cellpadding="0" width="98%" align="center">

<tr valign="top">

<th>

<input value="添加" type="button">

</th>

</tr>

</table>

<br />

<table border="1" width="98%" align="center" id="table1">

<tr>

<th >企业名称</th>

<th>操作<th>

</tr>

</table>

</form>

</body>

</html>

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

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类