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>

js:自动亮起100盏灯的更多相关文章

  1. python基础===100盏灯的问题

    闪存里有人这样提问这样: 第一轮操作所有电灯,第二轮操作第2盏,第4盏开关,以此类推,第三轮改变编号为3的倍数的电灯,第3盏,第6盏,如果原来那盏灯是亮的,就熄灭它,如果原来是灭的,就点亮它,以此类推 ...

  2. JS练习--自动生成100个li

    点击按钮,自动生成100个li,红.黄.蓝.绿四种颜色的顺序显示出现在页面中 CSS: ;;} ul,li{list-style: none;} #ul1{position: relative;} # ...

  3. js自动生成条形码插件-JsBarcode

    JsBarcode.html <!DOCTYPE html> <html lang="en"> <head> <meta charset= ...

  4. n盏灯亮灭问题

    前几天看了华为的一个上机操作题,讲得是n盏灯亮灭问题,本质上还是数学问题,感觉很有趣,和大家分享一下,问题描述如下: 有n盏灯排成一排,依次标号1,2,…,n,每盏灯都有一根拉线开关,最初电灯都是关着 ...

  5. MyEclipse 中 添加 js自动完成模版

    MyEclipse 中 添加 js自动完成模版: window>preference>MyEclipse>Files and Editors>JavaScript>Edi ...

  6. 【XSS】对抗蠕虫 —— 如何让按钮不被 JS 自动点击

    前言 XSS 自动点按钮有什么危害? 在社交网络里,很多操作都是通过点击按钮发起的,例如发表留言.假如留言系统有 XSS,用户中招后除了基本攻击外,还能进行传播 -- XSS 自动填入留言内容,并模拟 ...

  7. js 自动类型转换

    js自动类型转换 1.==符号在判断左右两边数据是否相等时,如果数据类型一致,直接比较值即可 2.==符号左右数据类型不一致时,如果两方数据为布尔型.数值型.字符串型时,不为数字的那一方自动调用Num ...

  8. 怎么用js编写1——100的质数？

    这里来自csdn问答的一个问题,怎么用js编写1——100的质数? http://ask.csdn.net/questions/214429 质数也就是素数,即只能被1和自身整除的数,因此可以构造循环 ...

  9. pageresponse.min.js自动缩放页面改写

    /* * 名称 :移动端响应式框架 * 作者 :白树 http://peunzhang.cnblogs.com * 版本 :v2.1 * 日期 :2015.10.13 * 兼容 :ios 5+.and ...

随机推荐

  1. normalize.css源码解析

    什么是normalize.css?  它是为了帮助我们统一各个浏览器的样式和消除bug的css库. 为什么需要normalize.css,有什么好处? 不像一些reset.css,normalize. ...

  2. linux 打包 压缩 解压缩

    gzip gzip xxx文件 压缩文件xxx,后缀.gz 并且删除原来文件 gzip -tv xxx.gz 测试压缩文件压完整性 压缩当前文件夹所有文件: zip -r ./1.zip ./* -r ...

  3. JavaScript数据结构-18.图结构广度优先和最短路径

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. vue测试安装和配置

    npm install --save-dev @vue/test-utils mocha mocha-webpack npm install --save-dev jsdom jsdom-global ...

  5. JVM的类加载时机

    类加载过程中每个步骤的顺序 我们已经知道,类加载的过程包括:加载.连接.初始化,连接又分为:验证.准备.解析,所以说类加载一共分为5步:加载.验证.准备.解析.初始化. 其中加载.验证.准备.初始化的 ...

  6. 使用postman模拟上传文件到springMVC的坑：the request was rejected because no multipart boundary was found

    参考该文解决问题:http://blog.csdn.net/sanjay_f/article/details/47407063 报错 threw exception [Request processi ...

  7. FocusBI:租房分析&星型模型

    微信公众号:FocusBI关注可了解更多的商业智能.数据仓库.数据库开发.爬虫知识及沪深股市数据推送.问题或建议,请关注公众号发送消息留言;如果你觉得FocusBI对你有帮助,欢迎转发朋友圈或在文章末 ...

  8. 决策树遇到sklearn.exceptions.NotFittedError: XXX instance is not fitted yet. Call 'fit' with appropriate arguments before using this method.的解决方案

    1.异常信息: C:\Python36\python36.exe "E:/python_project/ImoocDataAnalysisMiningModeling/第6章 挖掘建模/6- ...

  9. vue面试题总汇

    active-class是哪个组件的属性? vue-router模块的router-link组件. 嵌套路由怎么定义? 在实际项目中我们会碰到多层嵌套的组件组合而成,但是我们如何实现嵌套路由呢?因此我 ...

  10. SpringBoot MockMvc的单元测试

    对于类的测试,可以有很多的方式进行实现,比如可以使用PostMan,使用HttpClient请求等,这里主要讲的是MockMcv的测试 一:引入依赖 <dependency> <gr ...