Date对象和定时器

xiaoxiao2021-02-28  7

Date对象

...此处省略一个 W3C参考

具体参考

定时器

setInterval  循环定时器

语法:

setInterval(function () { 

 这里填写执行条件

},毫秒数);

这是每隔1000毫秒执行一次。

<script type="text/javascript"> setInterval (function () { console.log('1'); },1000); </script>

每隔1000毫秒输出一次字符串1。


clearInterval()  清除定时器

语法:

<script type="text/javascript"> var i = 1 setInterval (function () { console.log(i ++); if(i > 10) { clearInterval(1); } },100); </script>

clearInterval() 参数填写的是定时器的的返回值,

如果使用一个变量来接收定时器的返回值的话,那么接收到的值就是 1 

所以也可以这样写:

<script type="text/javascript"> var i = 1 var test = setInterval (function () { console.log(i ++); if(i > 10) { clearInterval(test); } },100); </script>

clearInterval() 参数里写的是定时器的接收返回值的变量。


setTimeout  单次定时器

setTimeout(function () {

1000毫秒后执行这条语句

},1000);

<script type="text/javascript"> setTimeout (function () { console.log('1'); },1000); </script>

1000毫秒后打印字符串1,只会输出一次。

clearTimeout   清除定时器

清除定时器,使用方法和上面那个一样的~ 


以上方法全部是全局对象window上的方法,内部函数的this指向window

小练习:

写一个计时器,3分钟停止

<style type="text/css"> input{ border: solid 1.2px black; font-size: 20px; text-align: right; } </style> <body> minutes: <input type="test" value="0" /> <br /><br> seconds: <input type="test" value="0" /> <script type="text/javascript"> var min = document.getElementsByTagName('input')[0]; var sd = document.getElementsByTagName('input')[1]; var minutes = 0, seconds = 0; var min1 = setInterval(function () { seconds ++; if(seconds == 60) { seconds = 0; minutes ++; } min.value = minutes; sd.value = seconds; if(minutes == 3) { clearInterval(min1) } },10); </script>
转载请注明原文地址: https://www.6miu.com/read-2500263.html

最新回复(0)