JavaScript-setTimeout使用

setTimeout() 是属于 window 的方法,该方法用于在指定的毫秒数后调用函数或计算表达式。

语法格式如下:

setTimeout(function[,delay,param1,param2,...]);
setTimeout(function[,delay]);
setTimeout(code[,delay]);

function

在到期时间(delay毫秒)之后执行的函数。

code(可选)

可选语法,可以使用字符串而不是function,在delay毫秒之后编译和执行字符串(但是不推荐,因为有安全风险)。

delay(可选)

延迟的毫秒数 (一秒等于1000毫秒),函数的调用会在该延迟之后发生。如果省略该参数,delay取默认值0,意味着“马上”执行,或者尽快执行。不管是哪种情况,实际的延迟时间可能会比期待的(delay毫秒数) 值长,

param1,...,paramN(可选)

附加参数,一旦定时器到期,它们会作为参数传递给 function 或执行字符串。

  • setTimeout 用法一
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=<device-width>, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        alert("start...");

        setTimeout("alert('hello')", 5000);
    </script>
</body>
</html>

浏览器打开index.html之后,首先弹出start...,过了5s之后(5000/1000 = 5)弹出“hello”。

注:无需调用,时间一到就会立刻执行setTimeout中的函数。

  • setTimeout 用法二
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=<device-width>, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        alert("start...");
        setTimeout(sum, 2000, 1, 2, 1);
        function sum(x, y, z) {
            alert(x + y + z);
        }
    </script>
</body>
</html>

运行结果:

setTimeout(sum, 2000, 1, 2);
    function sum(x, y, z) {
    alert(x + y + z);
}

如果减少一个参数,则运行结果如下:(参数必须保持一致)

  • setTimeout 用法三
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=<device-width>, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="jsTest.css">
</head>
<body>
    <div class="div" id="divs"></div>
    
    <script>
        alert("start...");
        var doc=document.getElementById('divs');

        setTimeout(function(){
            doc.style.backgroundColor="#FFCC80";
        },2000, setTimeout(function(){
            doc.style.backgroundColor='black';
        }, 1000));
    </script>
</body>
</html>
.div {
    width: 200px;
    height: 50px;
    background-color: pink;
}

运行结果:

第三个参数也是一个定时器,1s后就会开启。

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: JavaScript中的setTimeout是一个函数,它可以在指定的时间后执行一段代码。它的语法是setTimeout(function, milliseconds),其中function是要执行的代码,milliseconds是延迟的毫秒数。例如,setTimeout(function(){alert("Hello World!");}, 100)将在1秒后弹出一个消息框,显示"Hello World!"。 ### 回答2: JavaScript中的setTimeout()函数是一个用于设置定时器的方法。它接受两个参数:一个函数和一个延迟时间的毫秒数。 使用setTimeout()函数,我们可以在一定的延时后执行指定的函数。延时时间由第二个参数指定,单位为毫秒。 例如,我们可以使用setTimeout()函数来在页面加载后延迟3秒执行一个函数,如下所示: ``` setTimeout(function(){ console.log("3秒钟后执行此函数。"); }, 3000); ``` 上述代码中,setTimeout()函数将在3秒钟后执行一个匿名函数,该函数会在控制台打印出"3秒钟后执行此函数。"的消息。 setTimeout()函数还可以返回一个数字类型的定时器ID,用于取消定时器。可以使用clearTimeout()函数来取消setTimeout()函数设置的延时。 例如,如果我们想要在2秒后取消前面的定时器,可以使用如下代码: ``` var timerId = setTimeout(function(){ console.log("3秒钟后执行此函数。"); }, 3000); setTimeout(function(){ clearTimeout(timerId); console.log("定时器已取消。"); }, 2000); ``` 在上述代码中,我们先设置了一个定时器,并将其ID存储在timerId变量中。然后,将在2秒后用clearTimeout()函数来取消这个定时器,同时在控制台输出"定时器已取消。"的消息。 总而言之,setTimeout()函数是一种在JavaScript中使用的用于设置定时器的方法。它可用于在一定的延时后执行指定的函数,并提供了取消定时器的功能。 ### 回答3: javascript中的setTimeout()是一个用于设置定时器的函数。它接受两个参数,第一个参数是要执行的函数或要执行的代码片段,第二个参数是延迟的毫秒数。 使用setTimeout()函数,我们可以在指定的延迟时间后执行代码。延迟时间可能是任何正整数值,代表了从调用setTimeout()开始到执行函数的时间间隔。 下面是一个例子,展示了如何使用setTimeout()函数延迟执行一段代码: ```javascript // 延迟1000毫秒后执行一段代码 setTimeout(function(){ console.log("Hello, World!"); }, 1000); ``` 在上述示例中,我们传递了一个匿名函数作为第一个参数,这个函数将打印"Hello, World!"到控制台。第二个参数是延迟时间,这里设置为1000毫秒(1秒)。 使用setTimeout()函数可以创建动画效果、处理异步任务,或者在指定延迟后执行一些特定的行为。需要注意的是,setTimeout()函数并不保证在指定的延迟时间后立即执行,而是尽可能地在这段时间内执行。 此外,setTimeout()还返回一个计时器标识符,可以通过clearTimeout()函数来取消定时器。例如: ```javascript var timerId = setTimeout(function(){ console.log("Hello, World!"); }, 1000); // 取消定时器 clearTimeout(timerId); ``` 总之,setTimeout()函数在JavaScript中是一个非常常用的定时器函数,它可以延迟执行代码,提供了灵活的定时功能。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值