# 移动的方块
* 使用JS移动DIV
~~~
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>移动的方块</title>
<link rel="stylesheet" type="text/css" href="style.css"/>
<style>
div {
background-color: #FF0000;
width: 50px;
height: 50px;
position: absolute;
}
</style>
<script>
window.onload = function () {
var md = document.getElementById("MoveDiv");
var x = 0;
var y = 0;
window.setInterval (function() {
if (x <= 1000 && y == 0) {
x = x +1;
md.style.left = x + "px";
}
if (x == 1000 && y < 600) {
y = y + 1;
md.style.top = y + "px";
}
if (x > 0 && y == 600) {
x = x - 1;
md.style.left = x + "px";
}
if (x == 0 && y > 0) {
y = y - 1;
md.style.top = y + "px";
}
},1);
};//设置定时器每毫秒执行一周期
</script>
</head>
<body>
<div id="MoveDiv">DIV</div>
</body>
</html>
~~~
