JS setInterval()、 setInterval()与 clearInterval() 方法的使用

最新推荐文章于 2024-06-14 14:58:32 发布

那年夏天KEEP

最新推荐文章于 2024-06-14 14:58:32 发布

阅读量1.6k

点赞数

分类专栏： Javascript 文章标签： javascript

Javascript 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

HTML DOM setInterval()、clearInterval() 方法

<html>
<head>
  <title>标题</title>
  <script src="../js/clock.js" mce_src="js/clock.js"
          language="JavaScript">
  </script>
</head>
<body>

  <div id="clock"></div>

  <script language="JavaScript">
  <!--
    var clockDiv = document.getElementById("clock");

    // 自定义时钟对象，实时显示当前时间
    var clickObj = new Clock(clockDiv);

    /*
     * setInterval()方法使用，周期性的调用clickObj.getCurrentDate()
     * 以更新显示内容
      */
    var intervalId = window.setInterval("clickObj.getCurrentDate()", 1000);

  // -->
  </script>

  <br>

  <!-- 
     此处clearInterval()方法的参数intervalId就是上面setInterval()调用后的
     返回值 
  -->
  <input type="button" 
         onclick="window.clearInterval(intervalId)" 
         value="停止计时" />

</body>
</html>

setTimeout和setInterval

setTimeout和setInterval的语法相同。它们都有两个参数，一个是将要执行
的代码字符串，还有一个是以毫秒为单位的时间间隔，当过了那个时间段之后就将
执行那段代码。

    不过这两个函数还是有区别的，setInterval在执行完一次代码之后，经过
了那个固定的时间间隔，它还会自动重复执行代码，而setTimeout只执行一次那
段代码。

区别：window.setTimeout("function",time)；//设置一个超时对象，只执行一次,无周期
          window.setInterval("function",time)；//设置一个超时对象，周期＝'交互时间'

停止定时：
          window.clearTimeout(对象) 清除已设置的setTimeout对象
            window.clearInterval(对象) 清除已设置的setInterval对象
=========================================================
showTime();

function showTime() {
     var today = new Date();
     alert("The time is: " + today.toString());
     setTimeout("showTime()", 5000);
}

一旦调用了这个函数，那么就会每隔5秒钟就显示一次时间
===========================================================

===========================================================
setInterval("showTime()", 5000);

function showTime() {
     var today = new Date();
     alert("The time is: " + today.toString());
}

而setInterval却没有被自己所调用的函数所束缚，它只是简单地每隔一定时间
就重复执行一次那个函数。
===========================================================

那年夏天KEEP

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS setInterval()、 setInterval()与 clearInterval() 方法的使用

HTML DOM setInterval()、clearInterval() 方法<html><head> <title>标题</title> <script src="../js/clock.js" mce_src="js/clock.js" language="JavaScript"> </script></head><body> <div id="clo
复制链接

扫一扫

专栏目录