zoukankan      html  css  js  c++  java
  • js:自动亮起100盏灯

    1)    使用js在页面上显示100盏灯,并标记从1到100的编号
    2)    页面加载后3秒,从编号是1的灯依次自动亮起。
    3)    每过0.5秒亮下一盏灯(10分)
    4)    所有灯亮起后,弹出确认框,询问是否要关闭页面
    5)    点确定,页面自动关闭。点取消,页面不动。

    <!DOCTYPE html>
    <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>100盏灯</title>
        <meta charset="utf-8" />
    </head>
    <body onload="trunonLight();">
        <div id="divDengAll">
            <!--<img src="img/2.jpg.gif" id="deng01"/>-->
        </div>
        <script type="text/javascript">
            function trunonLight() {
                //放置100盏灯
                var divDengAll = document.getElementById("divDengAll");
                var str = "";
                for (var i = 0; i < 100; i++) {
                    str += "<img src="img/2.jpg.gif" id="deng0" + i + ""/>";
                }
                divDengAll.innerHTML = str;
                var j = 0;
                setTimeout(function () {
                    //3秒后执行
                    setInterval(function () {
                        turnonLight2(j);
                        j++
                    }, 500);
                }, 3000);
               
            }
            //开灯
            function turnonLight2(j) {
               // setTimeout(function () {
                    document.getElementById("deng0" + j).src = "img/1.jpg.gif";
                // }, 500);
                    if (j>=99) {
                        if (confirm("全部灯都已亮了,是否关闭本页面")) {
                            window.close();
                        }
                    }
            }
        </script>
    </body>
    </html>
  • 相关阅读:
    当前信息型强人工智能发展缺失条件--规则
    假象篇(1)-动态可变参数的神经网络
    02梦断代码阅读笔记
    结队开发之NABCD
    01梦断代码阅读笔记
    03构建之法阅读笔记
    进度3
    02构建之法阅读笔记
    01构建之法阅读笔记
    关于最大子序和的算法问题(二)
  • 原文地址:https://www.cnblogs.com/25miao/p/10205426.html
Copyright © 2011-2022 走看看