动态为表格添加行

最新推荐文章于 2024-05-07 15:27:01 发布

fulianglove

最新推荐文章于 2024-05-07 15:27:01 发布

阅读量930

点赞数

分类专栏： JavaScript 文章标签： html generator button javascript firefox css

本文链接：https://blog.csdn.net/fulianglove/article/details/2625414

版权

JavaScript 专栏收录该内容

8 篇文章 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>



 <BODY>

  <script language="javascript" type="text/javascript">

	function doEvent(obj)

	{	

	var tbody_1 = document.getElementById("tbody_1");

	var new_node = tbody_1.rows[tbody_1.rows.length - 1].cloneNode(true);

	tbody_1.appendChild(new_node);

	}





  </script>

<table id="tabel_1" >

<tbody id="tbody_1">

<tr rowindex="1">

<td>

<input type="button" value="BUTTON" οnclick="doEvent(this)">

</td>

</tr>

</tbody>

</table>



 </BODY>

</HTML>

代码十分简单，用解析xml的方式解析html，缺陷是在ie中必须添加到tbody里才有作用，firefox就不需要。

优点是在表格每行的结构都很复杂的时候，只需要复制一行的结构，再改变行中的值就可成为新的一行，同时可保证新行的

各个属性都和原有行保持一致

手动为新增的行，列添加css可使用element.style.cssText="css属性值";

fulianglove

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
动态为表格添加行

New Document function doEvent(obj) { var tbody_1 = document.getElementById("tbody_1"); var new_node = tbody_1.rows[tbody_1
复制链接

扫一扫

专栏目录