js 游戏
1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2<html xmlns="http://www.w3.org/1999/xhtml">
3<head>
4<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5<title>无标题文档</title>
6</head>
7<style>
8
#Game{ margin:50px 0px 0px 200px}
9#GameTable{ width:400px; height:400px; color:#FF0000}
10#GameTable caption{ color:#006600; text-align:left; font-size:13px}
11#GameTable thead{ color:#238DA0; font-size:13px; text-align:left; height:22px}
12#GameTable tr{}
13#GameTable tr td{
14
border:1px solid #0099FF;
15 text-align:center;
16 vertical-align:middle;
17 cursor:default;
18 background-color: #FEF4EF;
19
}
20.CellChanage{ color:#006600; background-color:#FFCCCC}
21.CellClick{ color:#0000FF; background-color:#EFFEF1}
22</style>
23<body>
24<input name="" type="button" value="开始" onclick='StartGame("Game")'/>
25<script>
26//开始游戏
27
28var RowCell=new Array();//存储满足条件的邻节点
29var ChildCell=new Array();//存储满足条件的子节点
30var CellNumber;
31var RunNumber;
32var ClickNumber;
33var NullNumber;
34var NullCountNumber;
35var ParentObj;
36var Sky;
37function StartGame(ObjId){
38 RowCell.length=0;
39 ParentObj=ObjId;
40 ChildCell.length=0;
41 CellNumber=8;
42 RunNumber=0;//累加
43 ClickNumber=0;//点击数
44 NullNumber=0;//空格
45 NullCountNumber=0;//总空格数
46var Obj=document.getElementById(ObjId);
47document.getElementById('Content').innerHTML="";
48
if(document.getElementById('GameTable')){Obj.removeChild(document.getElementById('GameTable'))};
49var tableObj=document.createElement('table');
50 tableObj.id = 'GameTable';
51var CaptionObj = tableObj.createCaption(); //船舰栏目题
52 CaptionObj.innerHTML="数字方块";
53var TheadObj = tableObj.createTHead();//创建HEAD
54var TheadRow = TheadObj.insertRow(0);
55var TheadCell = TheadRow.insertCell(0);
56 TheadCell.colSpan = CellNumber;
57 TheadCell.id = "GameHead";
58var spanObj = document.createElement('span');
59 spanObj.id = "GameCount";
60 spanObj.innerHTML = "Game";
61 TheadCell.appendChild(spanObj);
62 Sky=spanObj;
63
64var tBodyObj = document.createElement('tbody');
65 tableObj.appendChild(tBodyObj);
66 for(var Mu=0;Mu<CellNumber;Mu++){
67 var Row=tBodyObj.insertRow(Mu);
68 Row.id='x'+Mu;
69 for(Mx=0;Mx<CellNumber;Mx++){
70 var Cell=Row.insertCell(Mx);
71 Cell.id="Row"+Mu+"Cell"+Mx;
72 Cell.innerHTML=RndNumber();
73 function AddEvent(CellObj){
74 CellObj.attachEvent('onclick',function(){
75 Game_Cell_Click(CellObj);
76
});
77 }
78 AddEvent(Cell);
79 }
80 }
81 Obj.appendChild(tableObj);
82
83}//End Function
84
85function Game_Cell_Click(Obj){//程式的开始如开
86 RowCell.length=0;//清空邻节点
87 ChildCell.length=0;//清空子节点表
88 ClickNumber++;
89 RowCell[RowCell.length]=Obj.id;//
90 Child_T_L_B_R()//计算四个子节点
91}
92function Child_T_L_B_R(){//计算响铃节点
93 for(Mcl=0;Mcl<RowCell.length;Mcl++){//子节点集合中的四个子节点
94 RunNumber++;
95 var Obj=document.getElementById(RowCell[Mcl]);//获取节点
96 Obj.innerHTML=parseInt(Obj.innerHTML)+1;//累加1
97 if(parseInt(Obj.innerHTML)==0){return}
98 if(parseInt(Obj.innerHTML)>=5){//需要处理的
99 var tString=Obj.id;
100 var Row =tString.split("Cell")[0].split("Row")[1];
101 var Cell=tString.split("Cell")[1];
102 //分析顶部节点
103 Mt=parseInt(Row)-1;
104 for(Mt;Mt>=0;Mt--){
105 var tdObj=document.getElementById("Row"+Mt+"Cell"+Cell);
106 if(parseInt(tdObj.innerText)==0){continue};//继续
107 tdObj.innerText=parseInt(tdObj.innerText)+1;
108 tdObj.className="CellChanage";
109 if(tdObj.innerText==5){ChildCell[ChildCell.length]=tdObj.id;}//记录满足条件的子节点
110 break;
111 }//结束顶部搜索
112 //分析左边节点
113 Mc=Cell-1;
114 for(Mc;Mc>=0;Mc--){
115 var tdObj=document.getElementById("Row"+Row+"Cell"+Mc);
116 if(parseInt(tdObj.innerText)==0){continue}//继续
117 tdObj.innerText=parseInt(tdObj.innerText)+1;
118 tdObj.className="CellChanage";
119 if(tdObj.innerText==5){ChildCell[ChildCell.length]=tdObj.id;}//记录满足条件的子节点
120 break;
121 }
122 //分析底部节点
123 Mb=parseInt(Row)+1;
124 for(Mb;Mb<CellNumber;Mb++){
125 var tdObj=document.getElementById("Row"+Mb+"Cell"+Cell);
126 if(parseInt(tdObj.innerText)==0){continue};
127 tdObj.innerText=parseInt(tdObj.innerText)+1;
128 tdObj.className="CellChanage";
129 if(tdObj.innerText==5){ChildCell[ChildCell.length]=tdObj.id;}//记录满足条件的子节点
130 break;
131 }
132 //Right
133 Mr=parseInt(Cell)+1;
134 for(Mr;Mr<CellNumber;Mr++){
135 var tdObj=document.getElementById("Row"+Row+"Cell"+Mr);
136 if(parseInt(tdObj.innerText)==0){continue};
137 tdObj.innerText=parseInt(tdObj.innerText)+1;
138 tdObj.className="CellChanage";
139 if(tdObj.innerText==5){ChildCell[ChildCell.length]=tdObj.id;}//记录满足条件的子节点
140 break;
141 }
142 /*--------运算自身节点--------*/
143 Obj.className="CellClick";
144 Obj.innerHTML=0;
145 NullNumber++;
146 }//End if ==5
147 }//END FOR
148 //调用子节点计算
149 CellNumber*CellNumber
150 Sky.innerHTML="已使用："+ClickNumber+" 次 总空格"+CellNumber*CellNumber+"已完成"+NullNumber+" 个";
151 if(CellNumber*CellNumber==NullCountNumber+NullNumber){alert('恭喜你
');StartGame(ParentObj);return};
152 Game_Child_Cell();
153
154}
155function Game_Child_Cell(){
156if(ChildCell.length>0){
157 var Sky=document.getElementById('Content');
158 RowCell.length=0;
159 RowCell=ChildCell.slice(0,ChildCell.length);
160 ChildCell.length=0;
161 Child_T_L_B_R();
162 }
163 else{return}
164}
165//获取随机数
166function RndNumber(){
167var X=0;
168do{X=parseInt(Math.random()*10);}
169while (X>4)
170if(X==0){NullCountNumber++}
171return X;
172}
173</script>
174<div id="Game">
175</div>
176<div id='Content' style="position:absolute; top:50px; left:20px; font-size:12px;">
177
178</div>
179</body>
180</html>
181
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">2
<html xmlns="http://www.w3.org/1999/xhtml">3
<head>4
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />5
<title>无标题文档</title>6
</head>7
<style>8
#Game{ margin:50px 0px 0px 200px}
#Game9
#GameTable{ width:400px; height:400px; color:#FF0000}10
#GameTable caption{ color:#006600; text-align:left; font-size:13px}11
#GameTable thead{ color:#238DA0; font-size:13px; text-align:left; height:22px}12
#GameTable tr{}13
#GameTable tr td{14
border:1px solid #0099FF;15
text-align:center;16
vertical-align:middle;17
cursor:default;18
background-color: #FEF4EF;19
}20
.CellChanage{ color:#006600; background-color:#FFCCCC}21
.CellClick{ color:#0000FF; background-color:#EFFEF1}22
</style>23
<body>24
<input name="" type="button" value="开始" onclick='StartGame("Game")'/>25
<script>26
//开始游戏27
28
var RowCell=new Array();//存储满足条件的邻节点29
var ChildCell=new Array();//存储满足条件的子节点30
var CellNumber; 31
var RunNumber;32
var ClickNumber;33
var NullNumber;34
var NullCountNumber;35
var ParentObj;36
var Sky;37
function StartGame(ObjId){38
RowCell.length=0;39
ParentObj=ObjId;40
ChildCell.length=0;41
CellNumber=8;42
RunNumber=0;//累加43
ClickNumber=0;//点击数44
NullNumber=0;//空格45
NullCountNumber=0;//总空格数46
var Obj=document.getElementById(ObjId);47
document.getElementById('Content').innerHTML="";48
if(document.getElementById('GameTable')){Obj.removeChild(document.getElementById('GameTable'))};
49
var tableObj=document.createElement('table');50
tableObj.id = 'GameTable';51
var CaptionObj = tableObj.createCaption(); //船舰栏目题52
CaptionObj.innerHTML="数字方块";53
var TheadObj = tableObj.createTHead();//创建HEAD54
var TheadRow = TheadObj.insertRow(0);55
var TheadCell = TheadRow.insertCell(0);56
TheadCell.colSpan = CellNumber;57
TheadCell.id = "GameHead";58
var spanObj = document.createElement('span');59
spanObj.id = "GameCount";60
spanObj.innerHTML = "Game";61
TheadCell.appendChild(spanObj);62
Sky=spanObj;63
64
var tBodyObj = document.createElement('tbody');65
tableObj.appendChild(tBodyObj);66
for(var Mu=0;Mu<CellNumber;Mu++){67
var Row=tBodyObj.insertRow(Mu);68
Row.id='x'+Mu;69
for(Mx=0;Mx<CellNumber;Mx++){70
var Cell=Row.insertCell(Mx);71
Cell.id="Row"+Mu+"Cell"+Mx;72
Cell.innerHTML=RndNumber();73
function AddEvent(CellObj){74
CellObj.attachEvent('onclick',function(){75
Game_Cell_Click(CellObj);76
});77
}78
AddEvent(Cell);79
}80
}81
Obj.appendChild(tableObj);82
83
}//End Function84
85
function Game_Cell_Click(Obj){//程式的开始如开86
RowCell.length=0;//清空邻节点87
ChildCell.length=0;//清空子节点表88
ClickNumber++;89
RowCell[RowCell.length]=Obj.id;//90
Child_T_L_B_R()//计算四个子节点91
}92
function Child_T_L_B_R(){//计算响铃节点93
for(Mcl=0;Mcl<RowCell.length;Mcl++){//子节点集合中的四个子节点94
RunNumber++;95
var Obj=document.getElementById(RowCell[Mcl]);//获取节点96
Obj.innerHTML=parseInt(Obj.innerHTML)+1;//累加197
if(parseInt(Obj.innerHTML)==0){return}98
if(parseInt(Obj.innerHTML)>=5){//需要处理的99
var tString=Obj.id;100
var Row =tString.split("Cell")[0].split("Row")[1];101
var Cell=tString.split("Cell")[1];102
//分析顶部节点103
Mt=parseInt(Row)-1;104
for(Mt;Mt>=0;Mt--){105
var tdObj=document.getElementById("Row"+Mt+"Cell"+Cell);106
if(parseInt(tdObj.innerText)==0){continue};//继续107
tdObj.innerText=parseInt(tdObj.innerText)+1;108
tdObj.className="CellChanage";109
if(tdObj.innerText==5){ChildCell[ChildCell.length]=tdObj.id;}//记录满足条件的子节点110
break;111
}//结束顶部搜索112
//分析左边节点113
Mc=Cell-1;114
for(Mc;Mc>=0;Mc--){115
var tdObj=document.getElementById("Row"+Row+"Cell"+Mc);116
if(parseInt(tdObj.innerText)==0){continue}//继续117
tdObj.innerText=parseInt(tdObj.innerText)+1;118
tdObj.className="CellChanage";119
if(tdObj.innerText==5){ChildCell[ChildCell.length]=tdObj.id;}//记录满足条件的子节点120
break;121
}122
//分析底部节点123
Mb=parseInt(Row)+1;124
for(Mb;Mb<CellNumber;Mb++){125
var tdObj=document.getElementById("Row"+Mb+"Cell"+Cell);126
if(parseInt(tdObj.innerText)==0){continue};127
tdObj.innerText=parseInt(tdObj.innerText)+1;128
tdObj.className="CellChanage";129
if(tdObj.innerText==5){ChildCell[ChildCell.length]=tdObj.id;}//记录满足条件的子节点130
break;131
}132
//Right133
Mr=parseInt(Cell)+1;134
for(Mr;Mr<CellNumber;Mr++){135
var tdObj=document.getElementById("Row"+Row+"Cell"+Mr);136
if(parseInt(tdObj.innerText)==0){continue};137
tdObj.innerText=parseInt(tdObj.innerText)+1;138
tdObj.className="CellChanage";139
if(tdObj.innerText==5){ChildCell[ChildCell.length]=tdObj.id;}//记录满足条件的子节点140
break;141
}142
/*--------运算自身节点--------*/143
Obj.className="CellClick";144
Obj.innerHTML=0;145
NullNumber++;146
}//End if ==5147
}//END FOR148
//调用子节点计算149
CellNumber*CellNumber150
Sky.innerHTML="已使用："+ClickNumber+" 次 总空格"+CellNumber*CellNumber+"已完成"+NullNumber+" 个";151
if(CellNumber*CellNumber==NullCountNumber+NullNumber){alert('恭喜你');StartGame(ParentObj);return};152
Game_Child_Cell();153
154
}155
function Game_Child_Cell(){156
if(ChildCell.length>0){157
var Sky=document.getElementById('Content'); 158
RowCell.length=0;159
RowCell=ChildCell.slice(0,ChildCell.length);160
ChildCell.length=0; 161
Child_T_L_B_R();162
}163
else{return}164
}165
//获取随机数166
function RndNumber(){167
var X=0;168
do{X=parseInt(Math.random()*10);}169
while (X>4)170
if(X==0){NullCountNumber++}171
return X;172
}173
</script>174
<div id="Game">175
</div>176
<div id='Content' style="position:absolute; top:50px; left:20px; font-size:12px;">177
178
</div>179
</body>180
</html>181
