DOM动态删除TABLE多行

最新推荐文章于 2019-07-30 10:16:03 发布
最新推荐文章于 2019-07-30 10:16:03 发布
阅读量573 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/youyj521/article/details/8164892
版权

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>DOM动态删除TABLE多行</title>
<script type="text/javascript">
function $(objId){
return document.getElementById(objId);
}
function del_tbl(tblN,ckN){
var ck = document.getElementsByName(ckN);
    var tab = $(tblN);
var rowIndex;
for(var i=0;i<ck.length;i++){
        if(ck[i].checked){
rowIndex = ck[i].parentNode.parentNode.rowIndex;

alert(rowIndex);
         tab.deleteRow(rowIndex);
i = -1;
}
}
}</script>
</head>
<body>
<form id="form1" name="form1" method="post" action="">
<table width="253" border="1" align="center" id="list">
<tr>
<td><input type="checkbox" name="cb_k" id="cb_k" /></td>
<td>2</td>
<td>3</td>
</tr>
<tr id="tr1">
<td width="28" height="41"><input type="checkbox" name="del" id="del" /></td>
<td width="124"><div align="center">第一行 </div></td>
<td width="79"><div align="center">1</div></td>
</tr>
<tr id="tr2">
<td height="36"><input type="checkbox" name="del" id="del" /></td>
<td><div align="center">第二行 </div></td>
<td><div align="center">2</div></td>
</tr>
<tr id="tr3">
<td height="40"><input type="checkbox" name="del" id="del" /></td>
<td><div align="center">第三行 </div></td>
<td><div align="center">3</div></td>
</tr>
<tr id="tr4">
<td height="37"><input type="checkbox" name="del" id="del" /></td>
<td><div align="center">第四行 </div></td>
<td><div align="center">4</div></td>
</tr>
<tr id="tr5">
<td height="50"><input type="checkbox" name="del" id="del" /></td>
<td><div align="center">第五行 </div></td>
<td><div align="center">5</div></td>
</tr>
<tr>
<td colspan="3">
<div align="center">
<input type="button" name="btn_del" id="btn_del" value="删 除" οnclick="del_tbl('list','del')"/>
</div></td>
</tr>
</table>
</form>
</body>
</html>

youyj521
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
（30）使用DOM删除表格数据
虚心求学_一点一滴
07-19 1090
<!-- 使用DOM删除元素：当你添加元素的时候，将删除的链接添加进去，然后为这个链接添加点击事件，每次点击这个链接的时候就会从表格中的tBoides中removeChild掉tr一行即可 -->  window.onload=function () { var oTab=document.getElementById('tab1'); var oBtn=document
javascript DOM操作之动态删除TABLE多行
10-29
DOM动态删除TABLE tr行的实现代码，需要的朋友可以参考下。
table 中 动态添加，删除行；或根据选中的checkbox删除行。
urey_song的博客
03-29 1689
.dongtaitable tr:nth-child(odd){background:#F4F4F4;} .dongtaitable td:nth-child(even){color:#C00;} function addRow() { var table = document.getElementById("qingkuang_table"); var text1 =
DOM（二）-10-(示例-删除表格的行和列)
wy_0928的博客
08-20 600
表格样式table.css代码 @CHARSET "UTF-8"; table{ border:##249bdb 1px solid; width:500px; border-collapse:collapse; } table td{ border:#249bdb 1px solid; padding:5px;/*td左边顶格*/ } 主程序代码 <!-- 添加新功
js表格中的DOM操作之添加、删除行
慵懒的猫
10-14 7601
功能实现：1、实现表格添加一行 2、实现表格删除当前行 步骤：1、根据表格id获取当前表格 2、获取表格中的tBody(Bodies[0]) 3、为添加按钮增加click事件，为tBody创建子节点添加 4、为当前行的a元素增加click事件，删除本行 注意点：1、添加一行时，生成序号的获取 2、删除时，获取a元素，添加事件
element实现table的批量删除行功能
sunlizhen的专栏
07-30 7471
<template> <div class="oDiv"> <div style="margin-top: 20px"> <el-button @click="delArray()" type="danger">批量删除</el-button> <el-button @click="toggle...
jQuery 实现批量提交表格多行数据的方法
10-18
在本文中，我们将深入探讨如何使用jQuery来实现批量提交表格中的多行数据。批量提交功能在数据处理中非常常见，特别是在需要用户选择多个记录进行统一操作的场景下，如删除、更新或审核等。以下是对标题和描述中所述...
JQuery实现表格动态增加行并对新行添加事件
10-25
在网页开发中，jQuery是一个非常流行的JavaScript库，它简化了DOM操作、事件处理以及Ajax交互。本示例探讨了如何使用jQuery实现表格动态增加行的功能，并且在新行上添加事件，以提升用户体验和性能。 首先，我们...
两个table之间相互移动数据
12-03
首先，我们要理解表格（Table）是数据库中最基本的数据存储单元，它是由多行多列组成的数据结构，用于组织和管理结构化的信息。在关系型数据库中，表之间的数据交互通常通过SQL（Structured Query Language）语句来...
05创建公务卡扣减明细表_CASH_USE_MINUSAMT_DETAIL_20240708-刘君.sql
最新发布
07-19
05创建公务卡扣减明细表_CASH_USE_MINUSAMT_DETAIL_20240708-刘君.sql
【BP回归预测】龙格库塔算法优化BP神经网络RUN-BP光伏数据预测（多输入单输出）【含Matlab源码 5171期】.zip
07-19
CSDN海神之光上传的全部代码均可运行，亲测可用，直接换数据就行，适合小白； 1、代码压缩包内容 主函数：Main .m； 数据； 调用函数：其他m文件；无需运行 运行结果效果图； 2、代码运行版本 Matlab 2019b；若运行有误，根据提示修改；若不会，可私信博主； 3、运行操作步骤 步骤一：将所有文件放到Matlab的当前文件夹中； 步骤二：双击打开除Main.m的其他m文件； 步骤三：点击运行，等程序运行完得到结果； 4、仿真咨询 如需其他服务，可私信博主或扫描博主博客文章底部QQ名片； 4.1 CSDN博客或资源的完整代码提供 4.2 期刊或参考文献复现 4.3 Matlab程序定制 4.4 科研合作 智能优化算法优化BP神经网络分类预测系列程序定制或科研合作方向： 4.4.1 遗传算法GA/蚁群算法ACO优化BP 4.4.2 粒子群算法PSO/蛙跳算法SFLA优化BP 4.4.3 灰狼算法GWO/狼群算法WPA优化BP 4.4.4 鲸鱼算法WOA/麻雀算法SSA优化BP 4.4.5 萤火虫算法FA/差分算法DE优化BP 4.4.6 其他优化算法优化BP
在UCA上结合DOA估计算法和自适应波束形成matlab代码.rar
07-19
1.版本：matlab2014/2019a/2021a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。 5.作者介绍：某大厂资深算法工程师，从事Matlab算法仿真工作10年；擅长智能优化算法、神经网络预测、信号处理、元胞自动机等多种领域的算法仿真实验，更多仿真源码、数据集定制私信+。 替换数据可以直接使用，注释清楚，适合新手
【信号分解】基于海鸥优化算法SOA-CEEMDAN实现信号去躁附matlab代码.rar
07-19
1.版本：matlab2014/2019a/2021a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。 5.作者介绍：某大厂资深算法工程师，从事Matlab算法仿真工作10年；擅长智能优化算法、神经网络预测、信号处理、元胞自动机等多种领域的算法仿真实验，更多仿真源码、数据集定制私信+。 替换数据可以直接使用，注释清楚，适合新手
毕业设计javajspKTV包房管理系统(ssh)-qkrp源码含文档
07-19
毕业设计javajspKTV包房管理系统(ssh)-qkrp源码含文档 后台是ssh框架，页面是jsp，数据库mysql，jdk1.8，开发工具用ecplise、myecplise、sts、idea都可以 采用全新的计算机网络和管理系统，将成为提高KTV管理效率，改善服务水准的重要手段之一。所以城市KTV包房信息管理系统是KTV经营不可缺少的现代工具。系统的主要功能包括：会员管理、类别管理、包房管理、预订管理。 包含：源码、数据库脚本、论文、环境工具包、相同框架项目的安装教程（在说明文档中）
基于Springboot的图书管理系统论文
07-19
传统信息管理主要依赖管理人员的手工登记与管理。然而，近年来信息技术的快速进步促使许多陈旧的信息管理方式得以更新。特别是图书信息，因其管理内容复杂且数量庞大，手工处理方式已难以满足广大用户的需求，于是图书管理系统应运而生。 本图书管理系统设有管理员和用户两种权限。管理员负责管理用户基本信息、公告信息及图书信息，并能与用户进行交流等。用户则可以查看图书信息、公告以及管理员的回复等。 该系统采用WEB应用程序开发中流行的小程序结构模式，使用空间占用小但功能全面的MySQL数据库进行数据存储，并运用了JSP技术进行开发。该图书管理系统有效解决了传统手工操作中的诸多问题，如数据查询耗时长、管理步骤繁琐等。总体而言，该图书管理系统性能稳定、功能完备，且具有较高的性价比。
自监督学习：YOLO模型性能提升的新前沿
07-19
YOLO（You Only Look Once）是一种流行的实时对象检测系统，最初由 Joseph Redmon 等人在 2015 年提出。它的核心思想是将对象检测任务视为一个回归问题，直接从图像像素到边界框坐标和类别概率的映射。YOLO 以其快速和高效而闻名，特别适合需要实时处理的应用场景。 以下是 YOLO 的一些关键特点： 1. **单次检测**：YOLO 模型在单次前向传播中同时预测多个对象的边界框和类别概率，不需要多次扫描图像。 2. **速度快**：YOLO 非常快速，能够在视频帧率下进行实时检测，适合移动设备和嵌入式系统。 3. **端到端训练**：YOLO 模型可以从原始图像直接训练到最终的检测结果，无需复杂的后处理步骤。 4. **易于集成**：YOLO 模型结构简单，易于与其他视觉任务（如图像分割、关键点检测等）结合使用。 5. **多尺度预测**：YOLO 可以通过多尺度预测来检测不同大小的对象，提高了检测的准确性。 YOLO 已经发展出多个版本，包括 YOLOv1、YOLOv2（也称为 YOLO9000）、YOLOv3、YOLOv4 和 YOLOv5 等。
【信号分解】基于粒子群优化算法PSO-CEEMDAN实现信号去躁附matlab代码.rar
07-19
1.版本：matlab2014/2019a/2021a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。 5.作者介绍：某大厂资深算法工程师，从事Matlab算法仿真工作10年；擅长智能优化算法、神经网络预测、信号处理、元胞自动机等多种领域的算法仿真实验，更多仿真源码、数据集定制私信+。 替换数据可以直接使用，注释清楚，适合新手
读书笔记：LeanCloud 知识库 用户使用常见问题.zip
07-19
读书笔记：LeanCloud 知识库 用户使用常见问题
高分项目-基于SpringBoot框架实现的自习室预订系统（包含全套源码 + 数据库sql + 论文）.zip
07-19
高分项目-基于SpringBoot框架实现的自习室预订系统（包含全套源码 + 数据库sql + 论文）
dom动态删除id
05-24
可以使用JavaScript的`remove()`方法来动态删除一个元素的id属性。 例如，如果要删除id为"myElement"的元素的id属性，可以使用以下代码： ```javascript var myElement = document.getElementById("myElement"); myElement.removeAttribute("id"); ``` 这将从"myElement"元素中删除id属性。请注意，这不会删除元素本身，只会删除其id属性。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值