JavaScript中的setInterval()和setTimeout()

水深无声 2022-04-05 03:50 245阅读 0赞

**1.setlnterval()**

setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。

setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。

setInterval(code,millisec[,"lang"])

实例：

<html>
    <body>
    
    <input type="text" id="clock" size="35" />
    <script language=javascript>
    var int=self.setInterval("clock()",50)
    function clock()
      {
      var t=new Date()
      document.getElementById("clock").value=t
      }
    </script>
    </form>
    <button onclick="int=window.clearInterval(int)">
    Stop interval</button>
    
    </body>
    </html>

**2.setTimeout()**

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

setTimeout(code,millisec)

实例：

<html>
    <head>
    <script type="text/javascript">
    function timedMsg()
    {
    var t=setTimeout("alert('5 seconds!')",5000)
    }
    </script>
    </head>
    
    <body>
    <form>
    <input type="button" value="Display timed alertbox!"
    onClick="timedMsg()">
    </form>
    <p>Click on the button above. An alert box will be
    displayed after 5 seconds.</p>
    </body>
    
    </html>

实例：

<script>
    
        function load() {
            //第一个图表
    
            var myChart1 = echarts.init(document.getElementById('change-echarts1'));
    
            var app = {
                xday:[],
                yvalue:[]
            };
    
            // 发送ajax请求，从后台获取json数据
            $(document).ready(function () {
                getData();
                console.log(app.xday);
                console.log(app.yvalue);
            });
    
            function getData() {
             $.ajax({
                url:'echarts',
                data:{},
                type:'get',
                dataType:'json',
                success:function(result) {
                    alert(result.yvalues);
                    app.xday = result.xdays;
                    app.yvalue = result.yvalues;
                    myChart1.setOption({
                        title: {
                            text: 'PH数据变化情况'
                        },
                        tooltip: {},
                        legend: {
                            data:['PH']
                        },
                        xAxis: {
                            data: app.xday
                        },
                        yAxis: {},
                        series: [{
                            name: 'PH',
                            type: 'line',
                            data: app.yvalue
                        }]
                    })
                },
                error:function (msg) {
                    console.log(msg);
                    alert('系统发生错误');
                }
            })
            };
    
            t = setTimeout("load()",5000);
    
        };
        
    </script>

**3.onload事件**

onload 事件会在页面或图像加载完成后立即发生。

<html>
    <head>
    <script type="text/javascript">
    function load()
    {
    window.status="Page is loaded"
    }
    </script>
    </head>
    
    <body onload="load()">
    </body>
    
    </html>

发表评论取消回复

表情：

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

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

相关阅读

相关 setTimeout和setInterval

概念：超时调用概念：setTimeout(func,ms) 等待ms时间之后执行回调函数func，只执行一次，调用setTimeout会返回一个ID，表示超时调用，超

Love The Way You Lie/ 2023年07月13日 15:30/ 0 赞/ 13 阅读

相关 javascript中定时执行的方法setinterval()和settimeout()和clearinterval()

Document自带的方法：循环执行：var timeid = window.setInterval（“方法名或方法”，“延时”）; window.clearIn

ゝ一世哀愁。/ 2022年12月31日 14:22/ 0 赞/ 136 阅读

相关 setInterval和setTimeout

setInterval(func, 1000) 在1000毫秒后，每隔1000毫秒执行1次 setInterval(func(), 1000) 在1000毫秒后执行1次

╰+哭是因爲堅強的太久メ/ 2022年09月25日 04:15/ 0 赞/ 238 阅读

相关 JavaScript中SetInterval与setTimeout的用法详解

在写H5游戏时经常需要使用定时刷新页面实现动画效果，比较常用即setTimeout()以及setInterval()，但是大家对SetInterval与setTimeout的用

以你之姓@/ 2022年06月13日 06:30/ 0 赞/ 286 阅读

相关 JavaScript 计时事件[setInterval(),setTimeout()]

JavaScript 计时事件通过使用 JavaScript，我们有能力作到在一个设定的时间间隔之后来执行代码，而不是在函数被调用后立即执行。我们称之为计时事件。

秒速五厘米/ 2022年06月08日 02:56/ 0 赞/ 240 阅读

相关 javascript setInterval和setTimeout的this问题

The "`this`" problem 如果你通过setTimeout函数（或其他函数，或其他情况），调用的时候this的值可能并不能像你期待的那样。这种情况已经在[Jav

野性酷女/ 2022年06月04日 05:07/ 0 赞/ 224 阅读

相关 setInterval和setTimeout

在项目的支付模块中，最后选用的是支付宝二维码支付方式，增添的一个算是比较有技术含量的东西，就是采用轮询的方式，监听订单状态，对二维码进行刷新。代码如下： ![这里写图

叁歲伎倆/ 2022年05月21日 07:48/ 0 赞/ 351 阅读

相关 JavaScript中的setInterval()和setTimeout()

1.setlnterval() setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。 setInterval() 方法会不停地调用函数，直到

水深无声/ 2022年04月05日 03:50/ 0 赞/ 246 阅读

相关 JavaScript中的计时器SetInterval和Settimeout讲解

1.SetInterval 定义：；循环定时器：固定时间间隔指定一次，像闹钟一样，不关闭继续执行。语法结构：setInterval(code,millisec,l

矫情吗；*/ 2022年02月15日 03:17/ 0 赞/ 255 阅读

相关 setInterval和setTimeout的区别

setTimeout(表达式,延时时间) 在执行时,是在载入后延迟指定时间后,去执行一次表达式,记住,次数是一次用setTimeout实现的自动变化显示随机数的

刺骨的言语ヽ痛彻心扉/ 2022年01月06日 06:35/ 0 赞/ 347 阅读