javascript（十六）计时器、延时执行

最新推荐文章于 2023-11-03 22:05:07 发布

不许偷苹果

最新推荐文章于 2023-11-03 22:05:07 发布

阅读量793

点赞数

分类专栏： js 文章标签： javascript

本文链接：https://blog.csdn.net/qq_38904347/article/details/82794272

版权

js 专栏收录该内容

21 篇文章 0 订阅

订阅专栏

setInterval：定时器
按照指定的毫秒数重复执行<表达式>，直至窗口、框架被关闭或执行clearInterval。
格式：[定时器对象名=] setInterval(“<表达式>”，毫秒)
书写语法：setInterval(function(){执行的内容…},毫秒数);
setInterval(方法名称,毫秒数);
说明：无法传参，并且方法名称后面不能书写()
示例：

var b='';
window.onload = function(){
     b = setInterval(show,1000);
 }
 function show(){
     alert("大家好");
 }

表示调用show方法，1000毫秒执行一次

setInterval(“方法名称()”,毫秒数);
说明：可以传参，但需要注意字符串拼接规则
示例：

var b ='';
var c ='大中国';
 window.onload = function(){
     b = setInterval('show("'+c+'")',1000);
 }
 function show(text){
     alert(text);
 }

表示传入参数c，1000毫秒执行一次
clearInterval：终止定时器
格式：clearInterval(定时器对象名)

var a ="";
function text(){
     a = setInterval(function(){
         alert("你好");
     },3000);
 }
 function text_stop(){
     clearInterval(a);
 }

setTimeout：延时执行，仅执行一次
语法：setTimeout("<表达式>",毫秒数);
使用 clearTimeout() 来阻止函数的执行

 var gt = '';
function get_Time(){
    gt = setTimeout(function(){
        alert("我是setTimeout");
    },5000);
}
function close_Time(){
    clearTimeout(gt);
}

练习
随机点名

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>Document</title>
    <style type="text/css">
        .box{
            width:300px;
            height:200px;
            border:1px solid red;
            margin:0 auto;
        }
        #luck{
            width:100%;
            height:100px;
            line-height:100px;
            background:yellow;
            text-align:center;
            font-size:2em;
        }
        #open{
            width:100%;
            height:100px;
            line-height:100px;
            background:green;
            text-align:center;
            font-size:2em;
        }
    </style>
</head>
<body>
    <div class="box">
        <div id="luck">北京</div>
        <div id="open" onclick="ready()">开始</div>
    </div>
    <script type="text/javascript">
        var so=["上海","北京","天津","重庆","兰州","厦门"]
        var t;
        function ready(){
            var luck = document.getElementById("luck");
            var open = document.getElementById('open');
            if (open.innerHTML=='开始') {
                open.innerHTML="结束";
                t=setInterval(function(){
                    luck.innerHTML=so[Math.round(Math.random()*(so.length-1))];
                },200);
            }else{
                open.innerHTML="开始";
                clearInterval(t);
            }
        }
    </script>
</body>
</html>

不许偷苹果

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javascript（十六）计时器、延时执行

setInterval：定时器按照指定的毫秒数重复执行&lt;表达式&gt;，直至窗口、框架被关闭或执行clearInterval。格式：[定时器对象名=] setInterval(“&lt;表达式&gt;”，毫秒)书写语法：setInterval(function(){执行的内容…},毫秒数);setInterval(方法名称,毫秒数);说明：无法传参，并且方法名称后面不能书写()示...
复制链接

扫一扫