js实现表格的增添和删除操作

最新推荐文章于 2023-10-11 17:30:01 发布

要转行的阿江因为实在卷不过捏

最新推荐文章于 2023-10-11 17:30:01 发布

阅读量654

点赞数

分类专栏： js html 文章标签： javascript html

本文链接：https://blog.csdn.net/qq_59765516/article/details/125920339

版权

js 同时被 2 个专栏收录

4 篇文章 0 订阅

订阅专栏

html

2 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<table id="info" align="center" width="300" border="1">
			<caption>学生基本信息表</caption>
			<tr>
				<th>学号</th>
				<th>姓名</th>
				<th>年龄</th>
			</tr>
		</table>
		<div style="text-align:center"><button onclick="add()" >添加</button>
		<button onclick="del()">删除</button></div>
		<script type="text/javascript">
			var i=1;
			
			//添加数据
			function add () {
				i++;		
			var tab=document.getElementById("info");
			var r=tab.insertRow();
			var c1=r.insertCell(0);
			var c2=r.insertCell(1);
			var c3=r.insertCell(2);
			c1.innerHTML="2000";
			c2.innerHTML="小明";
			c3.innerHTML="10";			
			
			}
			//删除内容;
			function del () {			
				var tab=document.getElementById("info").lastChild;			
				var r=tab.deleteRow(1);			
			}
		</script>
	</body>
</html>