---恢复内容开始---

想要快速的做这样一个简单效果，首先要明白它的原理;

　　　　样式设置的重点，就是要跟上次拖拽一样，给该元素绝对定位，

　　　　事件就是onkeydown,事件，通过判断键码，来执行；

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			#dDiv{
				width: 100px;
				height: 100px;
				background-color: red;
				position: absolute;
			}
		</style>
		<script type="text/javascript">
			window.onload=function(){
				var dDiv=document.getElementById("dDiv")
				var a=8;
				var b=8;
				
				window.onkeydown = function(e){
					if(e.keyCode==37){
　　　　　　　　　　　　　　　　　　　　　　　　　　　　//左
//						当鼠标按下时判断键码
						dDiv.style.left=b-- +"px"
					}
					if(e.keyCode==38){
　　　　　　　　　　　　　　　　　　　　　　　　　　　　//上
						dDiv.style.top=a-- +"px"
					}
					if(e.keyCode==39){
　　　　　　　　　　　　　　　　　　　　　　　　　　　　//右
						dDiv.style.left=b++ +"px"
					}
					if(e.keyCode==40){
　　　　　　　　　　　　　　　　　　　　　　　　　　　　//下
						dDiv.style.top=a++ +"px"
					}
				}
			}
		</script>
	</head>
	<body>
		<div id="dDiv">
			
		</div>
	</body>
</html>

　　　　2.熟悉一下常使用的特殊键码：

　　　　　　

按键   	      键码	  按键	  键码	 按键  	 键码	
BackSpace 	8	   Esc	  27	    Right Arrow  39
Tab	                9	Spacebar	  32	    Down Arrow	  40
Clear    	       12	Page Up	  33	    Insert	          45	
/?	             191      Enter	         13	   Page Down	 34	
Delete	      46      `~	         192      -_	         189
.>	              190      Shift	         16	     End	       35	
Num Lock      144      [{219         Control  	17	
Home	     36      ;:	       186	      /|	      220
Alt	              18	  Left Arrow	37	    =+	    187	
]}	             221            Cape Lock	                                20

　　

　　　　

　　　　　　

---恢复内容结束---