2019-01-26作业

最新推荐文章于 2021-05-12 05:19:10 发布

张雪123

最新推荐文章于 2021-05-12 05:19:10 发布

阅读量87

点赞数

本文链接：https://blog.csdn.net/weixin_43986069/article/details/86507601

版权

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			#div1{
				border: 1px solid black;
			}
			#t2 td{
				border: 1px solid black;
			}
		</style>
		<script>
			var i=0;
			function add(){
			
				var num=document.getElementById("num").value;
				var nam=document.getElementById("nam").value;
				var loc=document.getElementById("loc").value;
				
				
				
				var tr=document.createElement("tr");
				 trid="tt"+i;
				
				tr.setAttribute("id","trid");
				var td1=document.createElement("td");
				var td2=document.createElement("td");
				var td3=document.createElement("td");
				var td4=document.createElement("input");
				
				td4.setAttribute("value","删除");
				td4.setAttribute("type","button");
				
				
			     td1.innerText=num;
			     tr.appendChild(td1);
			     td2.innerText=nam;
			     tr.appendChild(td2);
			     td3.innerText=loc;
			     tr.appendChild(td3);
			     tr.appendChild(td4);
			
			     
			     document.getElementById("t2").appendChild(tr);
			      	i++;
			      	
//			      	var b=document.getElementById("trid");
				td4.setAttribute("onclick","javascript:this.parentNode.remove()");
			
			}
			
//			function del(t){
		      document.write(t);
//        b=document
	       var a= document.getElementById("t1");
	       var b=a.document.getElementById("t");
	       document.write(b);
//	       b.remove();
//		
//			    
//			    
//			}
		</script>
	</head>
	<body>
		<div id="div1">
		<table id="t1">
			<tr>
				<td>部门编号：</td>
				<td><input type="text" id="num"></td>
			</tr>
			<tr>
				<td>部门名称：</td>
				<td><input type="text" id="nam"></td>
			</tr>
			<tr>
				<td>部门地址：</td>
				<td><input type="text" id="loc"></td>
				<td><input type="button" value="添加" onclick="add()" /></td>
			</tr>
		</table>
		<hr />
		<table id="t2">
			<tr id="tr0">
				<td>部门编号</td>
				<td>部门名称</td>
				<td>部门地址</td>
				<td></td>
			</tr>
			
		</table>
		</div>
	</body>
</html>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			#div1{
				width: 2000px;
				height: 40px;
				border:  1px solid red;
				line-height: 40px;
			}
			#div2{
				width: 2000px;
				height: 20px;
				border:  1px solid blue;
				line-height: 20px;
			}
		</style>
		<script>
			function move(){
				var div2=document.getElementById("div2");
				div2.parentNode.removeChild(div2);
			}
		</script>
	</head>
	<body>
		<div id="div1">红盒子</div>
		<br />
		<div id="div2">蓝盒子</div>
		<br />
		<input type="button" value="移动" onclick="move()"/>
	</body>
</html>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			#div1{
				width: 200px;
				height: 100px;
				border:  1px solid red;
			
			}
			#div2{
				width: 200px;
				height: 100px;
				border:  1px solid blue;
				
			}
			.cls1{
				width: 200px;
				height: 10px;
				border:  0px solid blue;
				margin-top: 10px;
			
			}
		</style>
		<script>
			function move1(){
				var div2=document.getElementById("div2");
				var div1=document.getElementById("div1");
				div2.appendChild(div1);
				
//				div1.style.margin="5px";
				div1.style.width="130px";
				div1.style.height="50px";
				
			}
		</script>
	</head>
	<body>
		<div id="div1">红盒子</div>
      
		<div id="div2">蓝盒子</div>
	
		<input type="button" value="移动" onclick="move1()"/>
	</body>
</html>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			#div1{
				width: 200px;
				height: 100px;
				border:  1px solid red;
		
			}
			#div2{
				width: 200px;
				height: 20px;
				border:  1px solid blue;
				
			}
		</style>
		<script>
			function move(){
				var div2=document.getElementById("div2");
				var div1=document.getElementById("div1");
				s1=document.createElement("span");
				s1.innerText="红盒子";
				div1.firstChild.remove();
				div1.appendChild(div2);
				div1.parentElement.insertBefore(s1,div1);
			}
		</script>
	</head>
	<body>
		<div id="div1"><span>红盒子</span></div>
		<br />
		<div id="div2">蓝盒子</div>
		<br />
		<input type="button" value="移动" onclick="move()"/>
	</body>
</html>

张雪123

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
2019-01-26作业

&lt;!DOCTYPE html&gt;&lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&lt;/title&gt; &lt;style&gt; #div1{ border: 1px solid black; } #t2 td{ borde
复制链接

扫一扫