<!DOCTYPE html>
<html>
<head>
<title>表格删除行</title>
<style>
table {
border-collapse: collapse;
}
th,
td {
border: 1px solid black;
padding: 8px;
}
th {
background-color: greenyellow;
}
.delete-link {
color: blue;
text-decoration: underline;
cursor: pointer;
}
</style>
</head>
<body>
<table id="myTable">
<tr>
<th>姓名</th>
<th>科目</th>
<th>成绩</th>
<th>操作</th>
</tr>
<tr>
<td>张三</td>
<td>JavaScript</td>
<td>100</td>
<td><a class="delete-link" onclick="deleteRow(this)">删除</a></td>
</tr>
<tr>
<td>李四</td>
<td>JavaScript</td>
<td>90</td>
<td><a class="delete-link" onclick="deleteRow(this)">删除</a></td>
</tr>
<tr>
<td>刘五</td>
<td>JavaScript</td>
<td>90</td>
<td><a class="delete-link" onclick="deleteRow(this)">删除</a></td>
</tr>
</table>
<script>
function deleteRow(link) {
var row = link.parentNode.parentNode;
row.parentNode.removeChild(row);
}
</script>
</body>
</html>
点击删除1
于 2023-12-22 09:40:56 首次发布