<!DOCTYPE html>
<html lang="">
<head>
    <mata charset = "utf-8" />
<title>打地鼠</title>
<style>
    #tb{
        background:url(beijing.jpg) no-repeat;
    }
    #fen{
        font-weight:bold;
        font-size:60px;
        font-family:迷你简哈哈;
    }
    #fen1{
        font-weight:bold;
        font-size:60px;
        font-family:迷你简哈哈;
    }
</style>
<script>
    function kaishi(){
        setTimeout("bh()",3000);
        sum=0;
    }
//    实现地鼠出现的动作
    function bh(){
        sj=Math.floor(Math.random()*9);
        img1=document.getElementsByTagName("img");
        img1[sj].src="dishu.gif";
//        给地鼠图片添加单击事件和打击动作
        img1[sj].setAttribute("onclick","daji()");
        setTimeout("xs()",1000);
    }
//    实现打击地鼠的动作，将地鼠图片更换为击中图片，并且去掉onclick事件，避免出现一只地鼠击中两次，加两次分数的情况
    function daji(){
        img1[sj].src="shang.gif";
        img1[sj].removeAttribute("onclick");
//        更换一次图片积分器加十分
        sum+=10;
//        改变积分器
        document.getElementById("fen").innerHTML=sum/10;
        document.getElementById("fen1").innerHTML=sum;
    }
//    一秒后没击中地鼠，地鼠消失动作
    function xs(){
        img1[sj].removeAttribute("onclick");
        img1[sj].src="keng.gif";
        setTimeout("bh()",1000);
    }
</script>
</head>

<body onload="kaishi()">
<center>
    <table id="tb">
        <foction>打地鼠</foction>
        <tr>
            <td><img src="keng.gif"></td>
            <td><img src="keng.gif"></td>
            <td><img src="keng.gif"></td>
        </tr>
        <tr>
            <td><img src="keng.gif"></td>
            <td><img src="keng.gif"></td>
            <td><img src="keng.gif"></td>
        </tr>
        <tr>
            <td><img src="keng.gif"></td>
            <td><img src="keng.gif"></td>
            <td><img src="keng.gif"></td>
        </tr>

    </table>
    <p id="fen">击中次数</p>
    <p id="fen1">分数</p>
</center>
</body>
</html>

js中打地鼠游戏的更多相关文章

  1. 纯JS编写打地鼠游戏

    这个游戏是本人前不久刚入门编写的游戏,感觉里面代码很LOW但是对于新手来说很一般般吧~ 没有上传音乐文件了 运行效果: 上代码(HTML+JS): <!DOCTYPE html> < ...

  2. 无聊的人用JS实现了一个简单的打地鼠游戏

    直入正题,用JS实现一个简单的打地鼠游戏 因为功能比较简单就直接裸奔JS了,先看看效果图,或者 在线玩玩 吧 如果点击颜色比较深的那个(俗称坏老鼠),将扣分50:如果点击颜色比较浅的那个(俗称好老鼠) ...

  3. 解读前端js中签名算法伪造H5游戏加分

    信息安全在我们日常开发中息息相关,稍有忽视则容易产生安全事故.对安全测试也提出更高要求.以下是笔者亲自实践过程: 一. 打开某个数钱游戏HTML5页面,在浏览器 F12 开发工具中,查看的js,如下, ...

  4. JS开发HTML5游戏《神奇的六边形》（一）

    近期出现一款魔性的消除类HTML5游戏<神奇的六边形>,今天我们一起来看看如何通过开源免费的青瓷引擎(www.zuoyouxi.com)来实现这款游戏. (点击图片可进入游戏体验) 因内容 ...

  5. 三维空间旋转和Three.JS中的实现

    三维空间中主要有两种几何变换,一种是位置的变换,位置变换和二维空间的是一样的.假设一点P(X1,Y1,Z1) 移动到Q(X2,Y2,Z2)只要简单的让P点的坐标值加上偏移值就可以了.但是三维空间的旋转 ...

  6. JS开发HTML5游戏《神奇的六边形》（二）

    近期出现一款魔性的消除类HTML5游戏<神奇的六边形>,今天我们一起来看看如何通过开源免费的青瓷引擎(www.zuoyouxi.com)来实现这款游戏. (点击图片可进入游戏体验) 因内容 ...

  7. 团队项目——打地鼠游戏(SPEC)系统性能评估测试

    1.SPEC测试的目标: 本轮测试的目的是测试打地鼠游戏的需求以及确保每个需求都能得到满足的方法.编写此需求说明书是为了使用户和开发人员对所开发的系统有一致的理解.通过阅读此说明书,开发人员可以了解当 ...

  8. JS开发HTML5游戏《神奇的六边形》（四）

    近期出现一款魔性的消除类HTML5游戏<神奇的六边形>,今天我们一起来看看如何通过开源免费的青瓷引擎(www.zuoyouxi.com)来实现这款游戏. (点击图片可进入游戏体验) 因内容 ...

  9. JS开发HTML5游戏《神奇的六边形》（三）

    近期出现一款魔性的消除类HTML5游戏<神奇的六边形>,今天我们一起来看看如何通过开源免费的青瓷引擎(www.zuoyouxi.com)来实现这款游戏. (点击图片可进入游戏体验) 因内容 ...

随机推荐

  1. sql 优化建议

    1.对查询进行优化,要尽量避免全表扫描,首先应考虑在 where 及 order by 涉及的列上建立索引. 2.应尽量避免在 where 子句中对字段进行 null 值判断,否则将导致引擎放弃使用索 ...

  2. 【ABAP系列】SAP ABAP常用函数总结第一篇

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[ABAP系列]SAP ABAP常用函数总结第一 ...

  3. python学习笔记：__init__.py的作用

    package标识,而非文件夹. 在pycharm中new,有Directory和Python Package两个选项. 分别创建Directory和package,发现前者只是一个空目录,后者包含一 ...

  4. C#清空StringBuilder的三种方法

    1.Remove例: StringBuilder val = new StringBuilder(); val.Append("...."); val.Remove(0,val.L ...

  5. jsp（java server page）

    jsp的组成元素; 1, 指令 page指令 <%@ page ..........%> language---当前页面使用的语言:java import---当前页面引入的类库, 默认是 ...

  6. [Codeforces 280D]k-Maximum Subsequence Sum（线段树)

    [Codeforces 280D]k-Maximum Subsequence Sum(线段树) 题面 给出一个序列,序列里面的数有正有负,有两种操作 1.单点修改 2.区间查询,在区间中选出至多k个不 ...

  7. BZOJ 1912（树的直径+LCA)

    题面 传送门 分析 显然,如果不加边,每条边都要走2次,总答案为2(n-1) 考虑k=1的朴素情况: 加一条边(a,b),这条边和树上a->b的路径形成一个环,这个环上的边只需要走一遍,所以答案 ...

  8. 烂漫爱心表白动画 分类： C# 2014-10-07 19:08 28人阅读 评论(0) 收藏

    曾经我说过我会用程序来表达我对你的爱. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...

  9. 各种设备在linux中的文件名

    各种设备在linux中的文件名: 设备         设备在linux内的文件名 ide硬盘 /dev/ha[a-d] scs硬盘 /dev/sd[a-p] u盘 /dev/sd[a-p](与SAT ...

  10. Django学习——开发你的第一个Django应用1

    突然对Django热情似火,所以就开学习了,我是根据官方文档学习的,所以我打算把官方文档翻译一遍,全当学习,首先贴官方文档的地址:https://docs.djangoproject.com/en/1 ...