基本信息
源码名称:打地鼠小游戏(带有背景音乐和敲打声)
源码大小:2.08M
文件格式:.rar
开发语言:js
更新时间:2019-06-19
   友情提示:(无需注册或充值,赞助后即可获取资源下载链接)

     嘿,亲!知识可是无价之宝呢,但咱这精心整理的资料也耗费了不少心血呀。小小地破费一下,绝对物超所值哦!如有下载和支付问题,请联系我们QQ(微信同号):813200300

本次赞助数额为: 2 元 
   源码介绍
网页小游戏

<script>
    // 获取指定的整数范围
    // a.先获取页面上所有的地鼠图片
    var mouses = document.querySelectorAll('img');
    //    b.获取数量
    var len = mouses.length;
    console.log(len);
    // 声明基础分数
    var score=0;
    // 获取页面上显示分数的元素
    var span = document.getElementById('score');
    // 获取页面上击中的音效
    var shutdown = document.getElementById('shutdown');
    //    定义一个函数
    function one() {
        //    从整数范围中随机获取一个整数
        // a.先获取一个(0.1)的随机数
        var ran = Math.random()
        // b.转为指定范围随机数
        var index = len * ran;
        // c. 向下取整(0,19)之间的整数
        index = Math.floor(index);
        console.log(index);

        // 根据随机的整数选项中对应的地鼠实现上升效果
          mouses[index].classList.remove('down')
        mouses[index].classList.add('up');
        // 从开始上升事件进行计算,在上升结束等待
        // 一小段事件再开始下落
        // 延迟函数,让某个动作在一定时间后在执行
        setTimeout(function () {
            //  下降时需要先去除原有的上升动作样式
            // 再添加需要的下降的动画样式
            mouses[index].classList.remove('up')
            mouses[index].classList.add('down')
        }, 1500);
    }
    function play(){
   // 使用 for 循环重复执行了7次
    for (var i = 0; i < 7; i ) {
        one();
    }
    }
    play();
    // 设置每隔一段时间出现一批地鼠
    setInterval(play,1500);
 
    // 给每一个地鼠都添加点击事件
    for (var k = 0; k < len; k ) {
        // 遍历地鼠集合,获取一个地鼠
        // 然后添加点击事件
        //当地鼠图片被鼠标点中后,对应的函数就会执行
        mouses[k].onclick = function (e) {
            // console.log('你点中我了!');
            // console.log(e.target);
            // e.表示事件对象,点击事件相关的所有信息集合
            // e.target 表示出发时间元素
            // 被点中之后,立刻执行下降动画
            e.target.classList.remove('up');
            e.target.classList.add('down');
            // 点中以后计算分数
            score =10;
            // 将分数显示在页面上 设置为标签内容
            span.innerText = score;
            // 播放击中音效
            shutdown.load();
            shutdown.play();
        }
    }
</script>