javascript动态添加行的例子

最新推荐文章于 2024-08-08 16:36:35 发布

httruly

最新推荐文章于 2024-08-08 16:36:35 发布

阅读量3.2k

点赞数

分类专栏： Jsp和Javascript 文章标签： javascript border generator table function html

本文链接：https://blog.csdn.net/httruly/article/details/559157

版权

Jsp和Javascript 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
function addTableRow(){
  var tr = window.event.srcElement.parentElement.parentElement;
  var tbody = tr.parentElement;
  var tr0 = tbody.rows[0];
  var oTR = tbody.insertRow(tr.rowIndex + 1);

  for (var i=0; i<tr.cells.length; i++)
  {
   var tdnew = oTR.insertCell();
   tdnew.innerHTML = tr0.cells[i].innerHTML;
   tdnew.classname = tr0.cells[i].classname;
  }
}

<BODY>
<TABLE border=1>
<TR style="display:none">
<TD style="color:red">0</TD>
<TD>
  <a οnclick="addTableRow()" href="#">添加</a>
  <a οnclick="deleteTableRow()" href="#">删除</a>
</TD>
</TR>
<TR>
<TD>a</TD>
<TD>b<a οnclick="addTableRow()" href="#">add</a></TD>
</TR>
<TR>
<TD>1</TD>
<TD>
  <a οnclick="addTableRow()" href="#">add</a>
  <a οnclick="deleteTableRow()" href="#">delete</a>
</TD>
</TR>
<TR>
<TD>2</TD>
<TD>
  <a οnclick="addTableRow()" href="#">add</a>
  <a οnclick="deleteTableRow()" href="#">delete</a>
</TD>
</TR>
<TR>
<TD>3</TD>
<TD>
  <a οnclick="addTableRow()" href="#">add</a>
  <a οnclick="deleteTableRow()" href="#">delete</a>
</TD>
</TR>
</TABLE>

<TABLE border=1>
<TR style="display:none">
<TD style="color:red">0</TD>
<TD>
  <a οnclick="addTableRow()" href="#">add</a>
  <a οnclick="deleteTableRow()" href="#">delete</a>
</TD>
</TR>
<TR>
<TD>a</TD>
<TD>b<a οnclick="addTableRow()" href="#">add</a></TD>
</TR>
<TR>
<TD>1</TD>
<TD>
  <a οnclick="addTableRow()" href="#">add</a>
  <a οnclick="deleteTableRow()" href="#">delete</a>
</TD>
</TR>
<TR>
<TD>2</TD>
<TD>
  <a οnclick="addTableRow()" href="#">add</a>
  <a οnclick="deleteTableRow()" href="#">delete</a>
</TD>
</TR>
<TR>
<TD>3</TD>
<TD>
  <a οnclick="addTableRow()" href="#">add</a>
  <a οnclick="deleteTableRow()" href="#">delete</a>
</TD>
</TR>
</TABLE>