0
点赞
收藏
分享

微信扫一扫

简单定时器

朱悟能_9ad4 2022-01-08 阅读 73

1.定时器

html和JavaScript代码:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button id="btn" onclick="onBtn()">开始倒计时</button>
    <script>
        var count = 10;
        //定义变量,来控制计时器的添加
        var time = true;
        console.log(time);
        function onBtn(){
            if(time){
                var timer = setInterval(function(){
                    //让倒计时在button里面显示
                    document.querySelector('#btn').innerHTML = --count;
                    //判断倒计时是否结束
                    if(count === 0)
                    {
                        //倒计时结束就清除定时器
                        clearInterval(timer);
                        //倒计时结束修改按钮内容
                        document.querySelector('#btn').innerHTML = '重新开始倒计时';
                        count = 10;
                        time =true;
                    }
                },1000)
                time=false;
          }else{
              return false;
          }
            
          
        }
        
    </script>
</body>
</html>
举报

相关推荐

0 条评论