HTML DOM setInterval()、clearInterval() 方法总结

 

js 间隔时间执行函数    

循环:每隔1秒执行一次
window.setInterval(infospan, 1000); 
一次:等待5秒后执行
 window.setTimeout(infospan, 500); 

js的setInterval()每隔指定的时间就执行对应的函数

setInterval()函数的语法如下:

setInterval ( code, milliseconds[, args...] )

// 每隔5秒钟就弹出提示信息"欢迎来到CodePlayer"。
setInterval('alert("欢迎来到CodePlayer");', 5000);

参数code也可以是一个函数调用。

function my(){
    alert("dhm");
}

// 每隔5秒钟就弹出提示信息"dhm"。
var intervalID = setInterval(my, 5000);

// 取消该定时设置
clearInterval(intervalID);
---------------------


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却没有被自己所调用的函数所束缚,它只是简单地每隔一定时间
就重复执行一次那个函数。
posted @ 2018-10-24 14:02  烟雨过客  阅读(7947)  评论(0编辑  收藏  举报