JS通过点击删除将单元格进行删除

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>通过点击删除将单元格进行删除</title>
	</head>
	<body>
		<table id="mytable" align="center" width="80%" border="1">
			<tr>
				<td>aaa</td><td>aaa</td><td>aaa</td><td>aaa</td>
				<td><a href="#" onclick="del(this)">删除</a></td>
			</tr>
			<tr>
				<td>bbb</td><td>bbb</td><td>bbb</td><td>bbb</td>
				<td><a href="#" onclick="del(this)">删除</a></td>
			</tr>
			<tr>
				<td>ccc</td><td>ccc</td><td>ccc</td><td>ccc</td>
				<td><a href="#" onclick="del(this)">删除</a></td>
			</tr>
			<tr>
				<td>ddd</td><td>ddd</td><td>ddd</td><td>ddd</td>
				<td><a href="#" onclick="del(this)">删除</a></td>
			</tr>
			<tr>
				<td>eee</td><td>eee</td><td>eee</td><td>eee</td>
				<td><a href="#" onclick="del(this)">删除</a></td>
			</tr>
		</table>
		<script type="text/javascript">
			//thisa表示链接对象
			function del(thisa){
				//链接对象的父节点是td,td的父节点是tr
				tr=thisa.parentNode.parentNode;
				//tr的父节点是table
				table=tr.parentNode;
				//table删除子元素,删除一行
				table.removeChild(tr);
			}
		</script>
	</body>
</html>
发布了19 篇原创文章 · 获赞 20 · 访问量 495

猜你喜欢

转载自blog.csdn.net/Handsome_gir/article/details/105230048