P20 演示定时器

Posted runmoxin

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了P20 演示定时器相关的知识,希望对你有一定的参考价值。

定时器的介绍

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>定时器</title>

<script>
    /* 
    定时器:
    1. 每隔一段时间执行依次函数setInterval(show, 3000);
        这个函数是一个间隔型的定时器, 意思就是每隔固定的时间执行依次,
        如果没有设置清楚定时器的话, 它会将参数中的函数一直执行下去.
    2. 延时型的定时器setTimeout(show, 1000);
        意思就是在1秒后, 执行show()函数.特点是只执行一次就结束了.
     */
    function show(){
        alert(a);
    }
    setInterval(show, 3000);
    setTimeout(show, 1000);
</script>
</head>
<body>
    
</body>
</html>

定时器的开启和关闭

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>定时器</title>

<script>
    window.onload = function(){
        var oBtn1 = document.getElementById("btn1");
        var oBtn2 = document.getElementById("btn2");
        var timer1 = ‘‘;
        var timer2 = ‘‘;

        oBtn1.onclick = function(){
            timer1 = setInterval(function(){
                alert("间隔型定时器");
            }, 3000);
        }
        oBtn2.onclick = function(){
            clearInterval(timer1);
        }
        /* 
        当然延时型的定时器也是需要开启和关闭的,这里就不再演示了.
        说明一下, 当设置了一个延时型的定时器, 时间是3秒的时候, 如果在3秒内是可以关闭定时器的.
        */
    }
</script>
</head>
<body>
    <input id="btn1" type="button" value="开启">
    <input id="btn2" type="button" value="关闭">
</body>
</html>

简单的数字时钟的实现

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>定时器</title>

    <script>
        /* 下面的这个函数的目的就是给小于10的数字前面补0, 变成两位数字组成的字符串 */
        function toDou(n) {
            if (n < 10) {
                return 0 + n;
            } else {
                return ‘‘ + n;
            }
        }
        window.onload = function () {
            var oImgs = document.getElementsByTagName("img");
            function tick() {
                var date = new Date();
                var str = toDou(date.getHours()) + toDou(date.getMinutes()) + toDou(date.getSeconds());
                for (let i = 0; i < oImgs.length; i++) {
                    oImgs[i].src = "../img/" + str.charAt(i) + ".png";
                    // str[i]的意思是取出字符串中下标为i的字符, 很方便, 但是不兼容.
                    // 但是在IE7以及之前的版本中是不支持这种做法的, 需要使用charAt()函数
                    // 考虑系统的兼容性, 建议使用charAt()
                }
            }
            setInterval(tick, 1000); // 由于1秒以后才会执行tick函数
            tick(); // 这里需要先执行以下更新当前时间
        }
    </script>
</head>

<body>
    <!-- 这里有个需要注意的就是, 在路径的时候, 一定要注意../时代表上级目录的意思-->
    <img src="../img/0.png" />
    <img src="../img/0.png" />
    <img src="../img/0.png" />
    <img src="../img/0.png" />
    <img src="../img/0.png" />
    <img src="../img/0.png" />

</body>

</html>

 

以上是关于P20 演示定时器的主要内容,如果未能解决你的问题,请参考以下文章

sql 这些代码片段将演示如何逐步使用PolyBase。你应该有一个blob存储和存储秘密方便

如何使用 Android 片段?

Android课程---Android Studio使用小技巧:提取方法代码片段

在案例演示中嵌入片段

华为p20pro投屏电脑 华为p20pro性能介绍

android MVP - 我可以有多个演示者用于自定义视图和片段