javascript如何实现div移动（代码）

来源：动视网责编：小采时间：2020-11-27 19:31:54

javascript如何实现div移动（代码）

javascript如何实现div移动（代码）:本篇文章给大家带来的内容是关于javascript如何实现div移动（代码），有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。描述：点击按钮，div移动，并指定停止位置，（定时器） <script> window.onload=function ()

推荐度：

点击下载本文 文档为doc格式

导读javascript如何实现div移动（代码）:本篇文章给大家带来的内容是关于javascript如何实现div移动（代码），有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。描述：点击按钮，div移动，并指定停止位置，（定时器） <script> window.onload=function ()

本篇文章给大家带来的内容是关于javascript如何实现div移动（代码），有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。

描述：点击按钮，div移动，并指定停止位置，（定时器）

 <script>
 window.onload=function () {
 var timer=null;
 var btn1=document.getElementById("btn1");
 btn1.onclick=function () {
 var div1=document.getElementById("div1");
 clearInterval(timer);//如果多次点击，那么会有多个定时器同时工作，移动速度不是设置的10,会有叠加效果，故应该清除
 timer= setInterval(function () {
 if(div1.offsetLeft>300)
 {
 clearInterval(timer);
 }
 else
 div1.style.left=div1.offsetLeft+10+'px';
 //offsetLeft获取当前div的位置
 },30);
 }
 }
 </script>