练习内容:鼠标点击哪个地方,内容就会移动到哪个地方
代码展示:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
*{
margin: 0;
padding: 0;
}
#wrapper{
width: 100px;
height: 100px;
background-color: aqua;
position: relative;
}
</style>
</head>
<body>
<div id="wrapper"></div>
<script>
var move=document.getElementById("wrapper");
document.onclick=function(e){
move.style.left=e.clientX-50+"px";
move.style.top=e.clientY-50+"px";
}
</script>
</body>
</html>
结果展示: