打子弹游戏 js

<table id="table">
    <tr>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
    </tr>
</table>
<div class="box" id="box"></div>

css


#table td{
    width: 20px;
    height: 20px;
}
.box {
    width: 20px;
    height: 20px;
    background: red;
    position: absolute;
    bottom: 0px;
    left: 0px;
}

.gun {
    width: 20px;
    height: 10px;
    position: absolute;
    bottom: 10px;
    left: 20px;
    background: green;
}

js

var table=document.getElementById(‘table‘);
var box=document.getElementById(‘box‘);
/*create table lines*/
/*var timer1=null;
timer1=setInterval(function () {
    var tr=document.createElement(‘tr‘);
    for(var i=0;i<20;i++){
        var td=document.createElement(‘td‘);
        td.innerHTML=1;
        tr.appendChild(td);
    }
    table.getElementsByTagName(‘tbody‘)[0].insertBefore(tr,table.getElementsByTagName(‘tbody‘)[0].getElementsByTagName(‘tr‘)[0]);
},3000);*/
/*move the box*/
document.onkeydown = function (e) {
    var keycode = e.keyCode;
    switch (keycode){
        case 37:
            $(‘#box‘).css(‘left‘,‘-=20‘);
            break;
        case 39:
            $(‘#box‘).css(‘left‘,‘+=20‘);
            break;
    }
    if(parseInt($(‘#box‘).css(‘left‘))<=0){
        $(‘#box‘).css(‘left‘,0);
    }
};

/*create gun to shoutdown*/
var timer2=null;
timer2=setInterval(function () {
    var gun=document.createElement(‘div‘);
    gun.className=‘gun‘;
    gun.style.bottom=10+‘px‘;
    gun.style.left=$(‘#box‘).css(‘left‘)
    document.body.appendChild(gun);
    $(gun).animate({
        ‘bottom‘: window.innerHeight-10+"px",
        ‘left‘:$(‘#box‘).css(‘left‘)
    }, 500, function () {
        var Num = parseInt(gun.style.left) / 20;
        $(‘td‘).eq(Num).html(‘‘);
        document.body.removeChild(gun);
    });
},5100);