<script>
// 为表增加一行
function create()
{
var tableObj = document.getElementById("tab");
alert(tableObj.rows.length);
var newRowObj = tableObj.insertRow(tableObj.rows.length);
// 此处的顺序应该和下面的顺序一致
var newColName = newRowObj.insertCell(newRowObj.cells.length);
var newColGender = newRowObj.insertCell(newRowObj.cells.length);
var newColAge = newRowObj.insertCell(newRowObj.cells.length);
var newColButton=newRowObj.insertCell(newRowObj.cells.length);
newColName.innerHTML = '刘德华';
newColGender.innerHTML = '男';
newColAge.innerHTML = 46;
newColButton.innerHTML = '<input type="button" value="Delete" onclick="deleteCurrentRow(this)">';
}
// 删除一行
function deleteCurrentRow(obj)
{
var trObj = obj.parentNode.parentNode;
var tBody = trObj.parentNode;
tBody.removeChild(trObj);
}
</script>
<html>
<body>
<center>
<input type="button" value="create table" onclick="create()"
<div id="table"></div>
<div>
<table id="tab">
<tr>
<td>姓名</td>
<td>性别</td>
<td>年龄</td>
<td>操作</td>
</tr>
</table>
</div>
</center>
</body>
</html>
分享到:
相关推荐
实现页面创建表格,和删除指定列、行单元格功能。利用JavaScript动态创建表格,可根据用户的使用需求动态添加指定列数、行数,删除指定列数、行数。删除成功或不成功时,会反馈给用户一个弹框提示,增强用户体验感。
jquery动态实现创建、删除整个表格,一行一行创建、删除表格。一格一格创建、删除表格
用js创建动态表格一些基本语法 avascript 动态创建表格:新增、删除行和单元格 利用js来动态创建表格有两种格式,appendChild()和insertRow、insertCell()。
NULL 博文链接:https://long316.iteye.com/blog/1393886
介绍了js动态创建表格,删除行列的实例代码,有需要的朋友可以参考一下
自己常用的js库和写的一个交互型可编辑表格: BaseJs库的一点源码: /** * 自定义javascript常用基础库 author zhang_jhai 创建时间 2010/04/10 最后修改时间 2010/05/03 * version 2.0 */ // Base库基础类 BaseJs ...
主要介绍了Javascript动态创建表格及删除行列的方法,涉及javascript动态操作表格的相关技巧,需要的朋友可以参考下
利用js来动态创建表格有两种格式,appendChild()和insertRow、insertCell()。两种方式其实差不多,但第一种有可能在IE上有问题,所以推荐大家使用第二种了,直接说吧。
NULL 博文链接:https://jeasony.iteye.com/blog/353914
JavaScript动态操作表格,添加,删除行、列及单元格
js的节点操作动态创建table表格,创建行,删除行
动态创建表格行; 支持 添加 删除 在table中可动态添加或删除任意多的行;
JavaScript动态生成带删除行功能的表格 本文实例为大家分享了javascript实现动态生成表格/删除行的具体代码,供大家参考,具体内容如下 动态生成一个带删除行功能的表格: 实现思路 1、获取表格元素 2、获取要...
简介 这篇文章简单介绍了DOM 1.0一些基本而强大的方法以及如何在JavaScript中使用它们。你可以学到如何动态地创建...单元格的文字内容是:“单元格是第y行第x列”,表示单元格在表格中的行数和列数。 代码如下:<ht
然后获取了表格元素及其 tbody 元素,通过 for 循环遍历数组中的每个学生,动态创建了表格的每一行和每个单元格,并将学生的信息填充到对应的单元格中。 最后,为每行的删除操作添加了点击事件处理程序。当用户单击...
4.动态dom对象创建表格树 5.完美支持json格式数据,支持xml(需转换) 6.支持ajax加载节点 7.事件驱动 8.可以动态根据列内容排序 9.简化函数参数,利用{} object输入参数,风格类似Extjs 10.树状结构可以选择出现在某一列...
当用户点击删除按钮时,我们通过 JavaScript 获取该按钮的父元素行,并从表格中删除该行。 需要注意的是,这个示例只是一个简单的演示,实际的图书管理系统可能需要更复杂的功能,例如添加、编辑、查询等。此外,该...
1.动态创建表格 2.表格具有间隔行颜色 3.具有鼠标进过高亮显示 4.可以进行编辑和删除 5.可以全选,全清,反选 6.编辑时可以显示下拉框,单选框和复选框
主要介绍了JavaScript如何动态创建table表格,一些时候需要动态的创建和删除表格,接下来的文章中将为大家介绍下javascript是如何做到的,感兴趣的朋友不要错过