• HMTL-扫雷3--地雷位置随机


    将小DIV设背景颜色并设置触发的事件(当点击小DIV时它的背景颜色变为背景图片)

    地雷的位置是随机的,每次打开网页地雷位置不一样。

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <style type="text/css">
    *
    {
        margin:0px auto;
        padding:0px;
    }
    #a1 div
    {
        width:100px;
        height:100px;
        background-color:#09F;
        border:1px solid black;
        float:left;
        background-size:100px 100px;
    }
    #a1
    {
        width:410px;
        height:410px;
    
    }
    </style>
    </head>
    
    <body>
    <div id="a1">
    
    </div>
    </body>
    <script type="text/javascript">
    var img=new Array();
    img[0]="url(images/1437459768106_03.jpg)";
    img[1]="url(images/1437459768106_04.jpg)";
    img[2]="url(images/1437459768106_05.jpg)";
    img[3]="url(images/1437459768106_06.jpg)";
    img[4]="url(images/1437459768106_11.jpg)";
    img[5]="url(images/1437459768106_12.jpg)";
    img[6]="url(images/1437459768106_13.jpg)";
    img[7]="url(images/1437459768106_14.jpg)";
    img[8]="url(images/1437459768106_19.jpg)";
    img[9]="url(images/1437459768106_20.jpg)";
    img[10]="url(images/1437459768106_21.jpg)";
    img[11]="url(images/1437459768106_22.jpg)";
    img[12]="url(images/1437459768106_27.jpg)";
    img[13]="url(images/1437459768106_28.jpg)";
    img[14]="url(images/1437459768106_29.jpg)";
    img[15]="url(images/1437459768106_30.jpg)";
    
    Load();
    
    function Load()
    {
        var c="";
        var a = Math.ceil(Math.random()*15);
        for(var i=0;i<16;i++)
        {
            if(i==a)
            {
                c=c+"<div onclick='pic(this,"+i+")' bs='lei'></div>";
            }
            else
            {
                c=c+"<div onclick='pic(this,"+i+")'></div>";
            }
        }
        
        var s=document.getElementById("a1");
        s.innerHTML=c;
    }
    
    function pic (a,i)
    {
        a.style.backgroundImage=img[i];
        if(a.getAttribute("bs")== "lei")
        {
            alert("踩中地雷了!");
            window.close();
        }
    }
    
    
    
    </script>
  • 相关阅读:
    非循环单链表节点的操作
    链表每一个节点的数据类型该如何表示
    链表的定义、确定一个链表需要几个参数?
    typedef的用法
    连续存储数组的算法(包含数组倒置、冒泡排序……)
    跨函数使用内存案例
    malloc()动态分配内存概述
    结构体
    指针和数组
    C#基础知识之dnSpy反编译
  • 原文地址:https://www.cnblogs.com/jia520110270/p/4766066.html
Copyright © 2020-2023  润新知