使用js删除表格中的一行的一个小练习

代码：

<!DOCTYPE html>
<html lang="ch"><head><meta charset="UTF-8"><title>使用js删除表格中的一行</title><style type="text/css">* {margin: 0;padding: 0;}#studentTable {margin: 80px auto;border: 1px solid black;border-collapse: collapse;width: 400px;height: 200px;}th, td {border: 1px solid black;text-align: center;}</style><script type="text/javascript">//点击删除按钮删除表格中的一行，首先绑定单击响应函数 找到这个删除的超链接//获取这一行（tr）删掉window.onload = function () {//获取所有的超链接 为每一个超链接都绑定上let allA = document.getElementsByTagName("a");for (let i = 0; i < allA.length; i++) {allA[i].onclick = function (){//根据超链接<a><a/> 找到td 在根据td 找到trlet tr =this.parentNode.parentNode; //this 表示当前对象的一个引用。//删除之前你要告诉人家你删除的谁 是否删除 防止误删除 （给人家反悔的机会）let name = tr.children[0].innerHTML;let flag = confirm("您确定删除"+name+"吗？他对于您也许真的很重要，在想想好不好？");//有一个Boolean类型的返回值if (flag){//true 删除tr.parentNode.removeChild(tr);}};}};</script></head><body><table id="studentTable"><tr><th>姓名</th><th>班级</th><th>等级</th><th>操作</th></tr><tr><td>七岁</td><td>云计算2班</td><td>A</td><td><a href="javascript:;">删除</a></td></tr><tr><td>柠木</td><td>云计算2班</td><td>A</td><td><a href="javascript:;">删除</a></td></tr><tr><td>木柠</td><td>大数据2班</td><td>S</td><td><a href="javascript:;">删除</a></td></tr><tr><td>柠木</td><td>云计算2班</td><td>A</td><td><a href="javascript:;">删除</a></td></tr><tr><td>木柠</td><td>大数据2班</td><td>S</td><td><a href="javascript:;">删除</a></td></tr><tr><td>柠木</td><td>云计算2班</td><td>A</td><td><a href="javascript:;">删除</a></td></tr><tr><td>木柠</td><td>大数据2班</td><td>S</td><td><a href="javascript:;">删除</a></td></tr></table></body>
</html>

效果：

使用js删除表格中的一行的一个小练习相关推荐

js动态删除表格中的某一行
js动态删除表格中的某一行 <!DOCTYPE html> <html lang="en"> <head><meta charset=&q ...
dtgrid 手动条件删除表格中的某一行
dtgrid 手动条件删除表格中的某一行 var grid = $.fn.DtGrid.init(dtGridOption);$(function () {grid.load();});functio ...
（转）用JS实现表格中隔行显示不同颜色
用JS实现表格中隔行显示不同颜色第一种: <style> tr{bgColor:expression( this.bgColor=((this.rowIndex)%2==0 )? ...
js删除数组中指定对象
js删除数组中指定对象需求说明从数组中移除指定对象函数封装 `removeArray` 从数组中获取指定对象索引函数封装 `getArrayIndex ` 在`Vue`中调用函数使用需求说明点 ...
excel删除无尽空白行_Excel2019如何批量删除表格中的空白行？
在使用Excel2019编辑文档的时候,在表格中有很多的空白行如何批量的把这些空白行给删除掉呢 Excel2019如何批量删除表格中的空白行? 首先在电脑上用Excel2019打开要编辑的表格,可以看 ...
js删除网页中图片width 和 height
js删除网页中图片width 和 height 一段代码轻松搞定适用于: 电脑端网页带图片属性导致移动网页显示错位/错误备注: 需搭配jquery.min.js (注!jquery-2.0以上版本 ...
js删除数组中的指定对象
js删除数组中的指定对象正常删除有时存在无法完全删除指定的所有对象,原因就在于如果从头开始循环,遇到连续两个需要删除的元素时,删掉第一个,下一个元素就自动顶上来代替已删除的元素位置,然后程序再一次循 ...
删除表格中拼音+取消表格中的筛选+将数字转换为文字
以下为表格相关学习内容一.删除表格中拼音 1.先说明一下LEN函数和LENB函数的区别 .Len是返回字符串的字符数,lenb是返回字符串的字节数. 区别在于,len是按字符数计算的,lenb是按字 ...
Word中删除双删除线的内容和删除表格中的空白行
这周四开会,发现部门的需求文档里,都是没用的双删除线,完全没有用途,几百页的文档里充斥了这样的垃圾,让我看着很不爽,所以就写了VBA程序来把这些内容删除了,试了试还不错.代码如下: Function ...

使用js删除表格中的一行的一个小练习

使用js删除表格中的一行的一个小练习相关推荐

最新文章

热门文章