javascript定时器的简单应用示例【控制方块移动】

2024-05-06 16:52:17

字体：大中小

来源：转载

供稿：网友

本文实例讲述了javascript定时器的简单应用。分享给大家供大家参考，具体如下：

<!DOCTYPE html><html lang="en"><head>  <meta charset="UTF-8">  <title>www.vevb.com 定时器的应用</title>  <style>    #Div1 { width: 100px; height: 100px; position: absolute; background-color: red; top: 50px; }  </style></head><body><input id="oBtn1" type="button" value="铵钮"><div id="Div1"></div><script>  var oBtn = document.getElementById("oBtn1");  var oDiv = document.getElementById("Div1");  //var timer=null;  //oDiv.timer=null;  oBtn.onclick = function() {    clearInterval(oDiv.timer)    oDiv.timer = setInterval(function() {      var speed = parseInt(getStyle(oDiv, "left")) + 9;      if(speed > 800) {        speed = 800;      }      oDiv.style.left = speed + "px"      if(speed == 800) {        clearInterval(oDiv.timer);        //alert(speed)      }    }, 50)  }  function getStyle(obj, attr) {    return obj.currentStyle ? obj.currentStyle[attr] : getComputedStyle(obj)[attr]  }</script></body></html>

希望本文所述对大家JavaScript程序设计有所帮助。

注：相关教程知识阅读请移步到JavaScript/Ajax教程频道。

上一篇：深入解析koa之异步回调处理

下一篇：如何从头实现一个node.js的koa框架