直入正題,用JS實現(xiàn)一個簡單的打地鼠游戲

因為功能比較簡單就直接裸奔JS了,先看看效果圖,或者 在線玩玩 吧 

電腦培訓,計算機培訓,平面設計培訓,網(wǎng)頁設計培訓,美工培訓,Web培訓,Web前端開發(fā)培訓

如果點擊顏色比較深的那個(俗稱壞老鼠),將扣分50;如果點擊顏色比較淺的那個(俗稱好老鼠),將得分100

 

實現(xiàn)

老鼠好像有點難畫,又不想用圖片,就直接用CSS畫個簡單的圖代表老鼠和坑吧

html結構

挺簡單,用9個 li 標簽代表坑,用9個 div 標簽代表老鼠

電腦培訓,計算機培訓,平面設計培訓,網(wǎng)頁設計培訓,美工培訓,Web培訓,Web前端開發(fā)培訓

  <div class="container">
        <h4>無聊打打地鼠</h4>

        <div class="game-top">
            <p><input type="button" value="開始游戲" id="game-start"><p>
            <p>得分:<span id="game-score">0</span></p>
            <p>剩余時間