初学Javascript做的一个别踩白块小游戏，代码简陋，如下：
<!DOCTYPE html>
<html>
<head>
<!-- 禁用缩放功能 -->
<meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>别踩白块</title> <style type="text/css">
table{
border: solid 5px;
border-spacing: 0px;
margin: auto;
background-color: #FFF;
}
td{
width: 80px;
height: 100px;
border: solid 1px;
} .bgcolor{
background: black;
}
</style>
</head>
<body style="background: #008694; margin: 0px;">
<div id="div1">
<table>
<caption style="font-size: 20px;">分数：<input id="text1" type="text">
别踩白块
</caption>
<tr>
<td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td>
</tr>
<tr>
<td onmousedown="onMouthEvent(this)"></td>
<td onmousedown="onMouthEvent(this)"></td>
<td onmousedown="onMouthEvent(this)"></td>
<td onmousedown="onMouthEvent(this)"></td>
</tr>
</table>
</div>
<div style="margin: auto; width: 340px; height: 40px; text-align: center; font-size: 30px;">
<b>点击黑块开始游戏</b>
<!-- <input style="width: 150px; height: 40px;" type="button" value="开始">
<input style="width: 150px; height: 40px;" type="button" value="暂停"> -->
</div> <script type="text/javascript">
function getShuiJiKuai(){
var oTrNode = document.getElementsByTagName("tr");
for(var i = 0; i < oTrNode.length; i++){
var randonNum = Math.floor(Math.random()*4);
(oTrNode[i].children[randonNum] || oTrNode[i].childNodes[randonNum]).className = "bgcolor";
}
}
getShuiJiKuai(); function moveDown() {
var oTrNode = document.getElementsByTagName("tr");
for(var i = oTrNode.length - 1; i > 0; i--){
for(var j = 0; j < 4; j++){
(oTrNode[i].children[j] || oTrNode[i].childNodes[j]).className = (oTrNode[i-1].children[j] || oTrNode[i-1].childNodes[j]).className;
}
} for(var k = 0; k < 4; k++){
(oTrNode[0].children[k] || oTrNode[0].childNodes[k]).className = "";
}
var randonNum = Math.floor(Math.random()*4);
(oTrNode[0].children[randonNum] || oTrNode[0].childNodes[randonNum]).className = "bgcolor";
}
//setInterval(moveDown, 500); var count = 0;
function onMouthEvent(event) {
var oTrNode = document.getElementsByTagName("tr");
var oTextNode = document.getElementById("text1");
if(event.className == "bgcolor"){
moveDown();
count++;
oTextNode.value = count;
}else{
var oTextNode = document.getElementById("text1");
alert("游戏结束,你的分数为："+count);
count = 0;
oTextNode.value = "";
}
}
//onMouthEvent();
</script>
</body>
</html>
点击之后，黑块才能往下落，只能在最后一行点击