项目中用到了行的动态添加，删除，google一下，没找到合适的，然后看下了文档，自己写了一个。
<!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>
<table border="1" id="mytb">
</table>
<input type="button" value="add" onclick="add()">
<input type="button" value="del()" onclick="del()">
</BODY>
</HTML>
<script>
var i=0;
function add(){
var mytb=document.getElementById("mytb");
var newRow = mytb.insertRow();
i++;
var newTd0 = newRow.insertCell();
var newTd1 = newRow.insertCell();
var newTd2 = newRow.insertCell();
newTd0.innerHTML="<input type='checkbox' name='chbox'>";
newTd1.innerHTML="张三"+i;
newTd2.innerHTML="李四"+i;
}
function del(){
var chboxs = document.getElementsByName("chbox");
var mytb=document.getElementById("mytb");
for(var i=chboxs.length;i>0;i--){
var e=chboxs[i-1];
if(e.checked){
//行的下标是从0开始的
mytb.deleteRow(i-1);
}
}
}
</script>
分享到：
相关推荐
js动态添加 删除行
<title>JS 动态添加删除行 姓名 年龄 <!-- 动态添加的数据行将放在这里 --> ()">添加行 ()">删除选中行 function addRow() { var table = document.getElementById('myTable'); var ...
在JavaScript中，动态添加行和删除行是网页交互中常见的需求，特别是在表格或者列表展示数据时。这通常涉及到DOM操作，包括元素的创建、插入和移除。以下是一些关于这个主题的重要知识点： 1. DOM操作： - `...
在开发Web应用时，动态添加和删除表格行是常见的需求，尤其在数据管理或表单填写场景中。本文将深入探讨如何使用C#后端和JavaScript前端技术来实现这一功能，为初学者提供一个基础的实践指导。 首先，我们要了解...
JS 动态添加删除 HTML 元素实例 动态添加删除 HTML 元素是前端开发中常见的需求之一，今天我们来探讨如何使用 JavaScript 实现动态添加删除 HTML 元素的实例。 首先，让我们了解一下 HTML 文档对象模型（DOM），它...
这篇博客"JavaScript动态添加删除表格行"可能详细讲解了如何使用JavaScript实现这一功能。通过给定的标签"源码"和"工具"，我们可以推测这篇文章会包含实际的代码示例和实用方法。 在HTML中，`<table>`元素用于创建...
### JS动态添加删除行知识点详解 #### 一、概述 在网页开发中，经常会遇到需要动态操作表格元素的情况，比如动态地添加或删除表格行。本文将基于给定的脚本代码来详细介绍如何使用JavaScript（简称JS）实现动态...
用Jquery 添加删除行, 并进行计算 品名 数量 单价 金额(计算得出) 添加(按钮) 品名 数量 单价 金额(计算得出) 删除(按钮) .... --- 总计:
同样，你可以根据需求修改这个示例，比如添加删除行的功能，或者改变单元格的内容和行为。理解这些基本原理后，就能灵活应对各种复杂的交互需求了。在实际项目中，你可能会遇到性能优化、兼容性处理、错误处理等问题...
在JavaScript编程中，实现...通过以上步骤，我们可以实现一个功能完备的表格动态添加删除行的JS特效，同时确保序号的自动更新和Tab切换效果。这样的功能在许多Web应用中都有广泛的应用，比如数据录入、配置管理等场景。
总的来说，"jquery表格动态添加删除行代码"是一个结合了HTML、CSS和JavaScript（主要是jQuery）的示例，它展示了如何利用这些技术来实现动态交互的表格功能。这样的功能在许多Web应用程序中都有广泛的应用，例如在线...
本文将深入探讨如何使用JavaScript动态地增加和删除表格行。 首先，我们来了解一下HTML表格的基本结构。一个表格由`<table>`元素包含，其中包含`<tr>`（表格行）元素，每行内可以有多个`<td>`（表格数据单元格）或`...
<title>jQuery动态添加删除行 <script src="https://code.jquery.com/jquery-3.6.0.min.js"> 姓名 年龄 操作 张三 <td>25 <td><button class="delete">删除</button></td> 添加行 ...
js 操作表格动态添加和删除行
在JavaScript和jQuery的世界里，动态地添加和删除DOM元素是常见的需求，特别是在处理表格数据时。本文将深入探讨如何利用jQuery实现动态添加和删除指定行的功能。 首先，我们来看动态添加行的操作。这个过程通常...
利用javascript来结合html，可以动态的添加一行数据，和根据索引来删除一行数据。
在JavaScript中，动态添加和删除表格是常见的网页交互功能，主要应用于数据展示、表单处理等场景。这篇博文通过一个简单的实例，展示了如何利用JavaScript实现这个功能。在讲解之前，我们先了解一下HTML表格的基本...
以下是关于"js动态添加行"的详细解释： 1. **理解DOM**: DOM是HTML或XML文档的结构化表示，它将网页内容转化为一个树状结构，使得我们可以用编程方式访问和修改页面元素。在JavaScript中，`document`对象提供了与...
JavaScript 动态添加或删除表格行 标题解释:JS 删除或者添加一行的代码，可以直接测试。 描述解释：该代码提供了 JavaScript 实现动态添加或删除表格行的功能，可以直接测试和应用。 标签解释：删除添加一行，指...
js table添加、删除行。点“添加”按钮可以添加一行，每行后面都有一个删除按钮，可以删除所在行。