js定时器的简单使用

关注

原创最新推荐文章于 2026-03-25 00:55:18 发布 828 阅读 AI 写同款· GEO 优化 ›

Javascript基础——定时器的使用及简单小应用(简易时钟1、延时提示框) 1、开启时钟、关闭时钟各有两种方式：开启：setInterval()、setTimeout() 关闭：clearInterval()、clearTimeout() 同时，setInterval()/setTimeout()开启时钟函数传递两个参数——执行函数/参数、间隔毫秒ms数这两种方式的区别是—— setInterval()函数会一直的执行下去，具有时间上的间隔性；阅读详情

js中的定时器有以下两中：
● setInterval() ：按照指定的间隔周期来调用函数或计算表达式。方法会不停地执行，直到 clearInterval() 被调用或窗口被关闭。
● setTimeout() ：在指定的毫秒数后调用函数或计算表达式，即延迟执行，只执行一次。

setInterval(code,millisec,lang)

code：要调用的函数或要执行的代码串，可以是字符串或js方法（必传参数）；
millisec：时间间隔，单位为ms（必传参数）；
lang：脚本类型， JScript | VBScript | JavaScript（可选参数）；

clearInterval(id)

id：setInterval返回的唯一ID值，用来确定要停掉哪个定时器；

示例代码1：

<html>
<body>
<input type="text" id="text1" />
<script language=javascript>
var id=self.setInterval("changetext()",5000);
var showNumber=1;
function changetext()
  {
  var t=new Date();
  document.getElementById("text1").value=showNumber;
showNumber++;
  }
</script>
</form>
<button onclick="window.clearInterval(id)">
停止</button>
</body>
</html>

示例代码2：

<html>
<body>
<input type="text" id="text1" />
<script>
var showNumber=1;
var id=self.setInterval(function changetext()
  {
  var t=new Date();
  document.getElementById("text1").value=showNumber;
showNumber++;
  },5000);
</script>
</form>
<button onclick="window.clearInterval(id)">
停止</button>
</body>
</html>

setTimeout(code,millisec,lang)

code：要调用的函数或要执行的代码串，可以是字符串或js方法（必传参数）；
millisec：在执行之前等待的时间，单位为ms（必传参数）；
lang：脚本类型， JScript | VBScript | JavaScript（可选参数）；

clearTimeout(id)

id：setTimeout返回的唯一ID值，用来确定要停掉哪个定时器；
示例代码：

<html>
<body>
<p>点击按钮， 5 秒后将弹出提示框</p>
<button onclick="btnClick()">click me</button>
<script language=javascript>
function btnClick()
{
    var time= new Date();
    alert("The time is: " + time.toString());
}
</script>
</body>
</html>