打子弹游戏 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);