Date对象和定时器

比眉伴天荒 2022-05-26 10:21 155阅读 0赞

**Date对象**

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

[具体参考][Link 1]

**定时器**

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>

[Link 1]: http://www.w3school.com.cn/jsref/jsref_obj_date.asp

发表评论取消回复

表情：

评论列表（有 0 条评论，155人围观）

还没有评论，来说两句吧...

相关阅读

相关 javascript内置对象 Math和Date

1 什么是对象 JS中所有的事物都是对象：字符串，数值，数组，函数…… JS中的万物皆对象。官方的解释：什么是对

冷不防/ 2023年08月17日 15:38/ 0 赞/ 146 阅读

相关 JavaScript Math对象和date对象的应用，定时器与延时器的应用，以及如何制作动态时钟

Math 对象中常用的方法 Math.random() 方法创建一个介于0~1之间的随机数，不包括1。常用于创建两个数之间的随机数。语法

ゝ一世哀愁。/ 2023年07月18日 06:44/ 0 赞/ 6 阅读

相关 Date对象

Date对象创建Date对象 new Date('2019/6/19 10:48:50') new Date(2019,5,19,10,48,50)

布满荆棘的人生/ 2022年10月23日 04:59/ 0 赞/ 177 阅读

相关 JavaScript Date对象详解和项目需求

最近更新时间：2017年3月24日16:34:50 [《我的博客地图》][Link 1] 作为初级工程师，开始需要学习的是业务流程和开发流程，随着这些经验的积累，对

偏执的太偏执、/ 2022年10月01日 00:59/ 0 赞/ 174 阅读

相关 JavaScript Date 对象

1、Date对象介绍 Date对象用于处理日期和时间。创建Date对象的语法： var myDate = new Date(); 注释：Date对

清疚/ 2022年08月21日 07:54/ 0 赞/ 212 阅读

相关 JavaScript Date对象

1. Date 对象的创建 JavaScript 的时间是由世界标准时间（UTC）1970 年 1 月 1 日开始，用毫秒计时构造函数 new Date();

港控/mmm°/ 2022年06月18日 08:12/ 0 赞/ 240 阅读

相关区分Date对象、new Date()和Date()函数

例: //获取当前日期 var d1 = new Date();//继承原型的方法 var d2 = Date(); //window的一个属性

水深无声/ 2022年06月04日 01:25/ 0 赞/ 300 阅读

相关 Date对象和定时器

Date对象 ...此处省略一个 W3C参考 [具体参考][Link 1] 定时器 setInterval 循环定时器语法： setInterval(

比眉伴天荒/ 2022年05月26日 10:21/ 0 赞/ 156 阅读

相关 Math 对象和 Date 对象

Math 对象和 Date 对象 `Math`对象是关于数学方面的一系列属性和方法，常见的属性有：圆周率、自然对数的底e……常见的方法有：取整函数、随机数的函数、幂函数、

约定不等于承诺〃/ 2022年03月11日 05:55/ 0 赞/ 301 阅读

相关 JavaScript Date对象

Date 对象用于处理日期和时间，在说Date对象之前需要介绍一点点日期和时间的背景知识 UTC,GMT和当地时间世界协调时间(UTC)又称世界统一时间，世界标准时间

谁践踏了优雅/ 2022年02月04日 00:23/ 0 赞/ 264 阅读