JS定时器的简单使用

最新推荐文章于 2024-05-31 08:30:00 发布

程序员小赵同学

最新推荐文章于 2024-05-31 08:30:00 发布

阅读量796

点赞数

文章标签： js 前端定时器

本文链接：https://blog.csdn.net/qq_33247435/article/details/87096448

版权

js 专栏收录该内容

7 篇文章 1 订阅

订阅专栏

js定时器有以下两个方法：

- setInterval()

语法：setInterval(code,millisec,lang)

code：必需。要调用的函数或要执行的代码串。
millisec：必须。周期性执行或调用 code 之间的时间间隔，以毫秒计。
lang：可选。 JScript | VBScript | JavaScript

按照指定的周期（ms）来调用函数或者计算表达式（不停的调用）。

- setTimeout()

语法：setTimeout(code,millisec,lang)

code：必需。要调用的函数后要执行的 JavaScript 代码串。
millisec：必须。在执行代码前需等待的毫秒数。
lang：可选。脚本语言可以是：JScript | VBScript | JavaScript

在指定的时间后调用函数或者计算表达式（一次）。

只看知识点有些枯燥，下面贴出实例，看实例学习的比较快：

setInterval实例：每 1000 毫秒执行 clock() 函数

<html>
    <body>
    
	    <input type="text" id="clock" />
	    
	    <script type="text/javascript">
		    var int=self.setInterval("clock()",1000);
		    function clock()
		    {
		    var d=new Date();
		    var t=d.toLocaleTimeString();
		    document.getElementById("clock").value=t;
		    }
	    </script>
	    
	    <button onclick="int=window.clearInterval(int)">停止</button>
    
    </body>
</html>

setTimeout实例：点击按钮，在等待 3 秒后弹出 "Hello"

<!DOCTYPE html>
<html>
    <head>
	    <meta charset="utf-8">
	    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
	    <p>点击按钮，在等待 3 秒后弹出 "Hello"。</p>
	    <button onclick="myFunction()">点我</button>
	    
	    <script>
		    function myFunction()
		    {
		        setTimeout(function(){alert("Hello")},3000);
		    }
	    </script>
	    
    </body>
</html>

下面是一个取消定时器的方法：

clearTimeout()

由上面的例子可以看出，var int=self.setInterval(“clock()”,1000);
执行setInterval之后会返回一个int型的值，将这个值传给clearTimeout即可中断循环中的定时器：window.clearInterval(int)。

程序员小赵同学

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
2
评论
JS定时器的简单使用

js定时器有以下两个方法：- setInterval() 语法：setInterval(code,millisec,lang) code：必需。要调用的函数或要执行的代码串。 millisec：必须。周期性执行或调用 code 之间的时间间隔，以毫秒计。 lang：可选。 JScript | VBScript | JavaScript 按照指定的周期（ms）来...
复制链接

扫一扫

专栏目录