javascript 基础练习做Bingo图

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

---恢复内容开始---

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>循环处理操作</title>
<script type="text/javascript">
/*
window.onload=iniAll;
function iniAll(){
for(var i=0;i<24;i++){
var newnum=Math.floor(Math.random()*75)+1;
document.getElementById("square"+i).innerHTML=newnum;
}
}
*/
//代码改进主要通过传参
/*
window.onload=iniAll;
function iniAll(){
for (var i=0;i<24;i++) {
setSquare(i);
}
}
function setSquare(thisquare){
var currsquare="square"+thisquare;
var newnum=Math.floor(Math.random()*75)+1;
document.getElementById(currsquare).innerHTML=newnum;
}*/
//探测对象。。。
/*
window.onload=iniAll;
function iniAll(){
if(document.getElementById){
for (var i=0;i<24;i++) {
setSquare(i);
}
}
else{
alert("not support")
}
}
function setSquare(thisquare){
var currsquare="square"+thisquare;
var newnum=Math.floor(Math.random()*75+1);
document.getElementById(currsquare).innerHTML=newnum;
}*/
//限制没一列的值
window.onload=iniAll;
function iniAll(){
if(document.getElementById){
for (var i=0;i<24;i++) {
setSquare(i);
}
}
else{
alert("not support")
}
}
function setSquare(thisquare){
var currsquare="square"+thisquare;
var colplace=new Array(0,0,0,0,0,1,1,1,1,1,2,2,2,2,3,3,3,3,3,4,4,4,4,4);
var colbasis=colplace[thisquare]*15;
var newnum= colbasis+Math.floor(Math.random()*15+1);
document.getElementById(currsquare).innerHTML=newnum;
}
</script>
<style type="text/css">
body{
background: #CCCCCC;
color: black;
font-size: 20px;
font-family: "arial, helvetica, sans-serif";
}
#free{
background: #fff;
}
h1{
font-size: 28px;
font-family: "微软雅黑";
}
table{
border-collapse: collapse;
}
th td{
padding: 10px;
border: 2px #555 solid;
text-align: center;
width: 40%;
}

</style>
</head>
<body>
<h1>my bingo</h1>
<table border="" cellspacing="" cellpadding="">
<tr>
<th>B</th>
<th>i</th>
<th>n</th>
<th>g</th>
<th>o</th>
</tr>
<tr>
<td id="square0">∇</td>
<td id="square5">∇</td>
<td id="square10">∇</td>
<td id="square14">∇</td>
<td id="square19">∇</td>
</tr>
<tr>
<td id="square1">∇</td>
<td id="square6">∇</td>
<td id="square11">∇</td>
<td id="square15">∇</td>
<td id="square20">∇</td>
</tr>
<tr>
<td id="square2">∇</td>
<td id="square7">∇</td>
<td id="free">free</td>
<td id="square16">∇</td>
<td id="square21">∇</td>
</tr>
<tr>
<td id="square3">∇</td>
<td id="square8">∇</td>
<td id="square12">∇</td>
<td id="square17">∇</td>
<td id="square22">∇</td>
</tr>
<tr>
<td id="square4">∇</td>
<td id="square9">∇</td>
<td id="square13">∇</td>
<td id="square18">∇</td>
<td id="square23">∇</td>

</tr>
</table>
</body>
</html>