获取表单信息，存放在表格中，展示出来并删除

最新推荐文章于 2022-08-03 20:19:01 发布

iuMeng

最新推荐文章于 2022-08-03 20:19:01 发布

阅读量239

点赞数

本文链接：https://blog.csdn.net/qq_44681288/article/details/88918768

版权

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>		
	</head>
	<body>
		姓名：<input type="text" />
		年龄：<input type="text" />
		性别：<input type="text" />
		<input type="button"value = "提交" id="btn">
		<table border="0" id="Tab"></table>
		<script>
			var oIN = document.getElementsByTagName("input");
			oIN[oIN.length-1].function(){
				var oTr = document.createElement("tr");
				for(var i=0;i<oIN.length-1;i++){
					 	var oTd = document.createElement("td");
					 	oTr.appendChild(oTd);
					 	Tab.appendChild(oTr);
					 	var val = oIN[i].value;
					 	var oTxt = document.createTextNode(val);
					 	oTd.appendChild(oTxt);
				}
				var anniu = document.createElement("td");
				oTr.appendChild(anniu); 
				anniu.innerHTML = "<span>删除</span>";
				var oSpan = document.getElementsByTagName("span");
				for(var i =0;i<oSpan.length;i++){
					oSpan[i].onclick = function(){
						Tab.removeChild(this.parentNode.parentNode);
					}
				}
			}
		</script>
	</body>
</html>

iuMeng

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
获取表单信息，存放在表格中，展示出来并删除

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> 姓名：<input type="text" /> 年龄：<input type="text"...
复制链接

扫一扫