-
Notifications
You must be signed in to change notification settings - Fork 2
/
scgrid100.html
87 lines (80 loc) · 2.01 KB
/
scgrid100.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>舒尔特表 10x10</title>
<style type="text/css">
table.tftable {
font-size: 12px;
color: #333333;
border-width: 1px;
border-color: #729ea5;
border-collapse: collapse;
}
table.tftable th {
display: flex;
font-size: 12px;
background-color: #acc8cc;
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #729ea5;
text-align: left;
}
table.tftable tr {
display: flex;
background-color: #d4e3e5;
}
table.tftable td {
font-size: 20px;
display: inline-flex;
justify-content: center;
align-items: center;
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #729ea5;
width: 50px;
height: 50px;
}
body {
display: flex;
justify-content: center;
align-items: center;
height: 98%;
width: 98%;
position: absolute;
}
</style>
</head>
<body>
<table id="sgrid" class="tftable" border="1">
</table>
</body>
<script>
var table = document.getElementById('sgrid');
var arr = [];
var num = 100;
var sqt;
for (var i = 1; i < num + 1; i++) {
arr.push(i);
}
sortFunc = function () {
return Math.random() * 100 - 50;
};
for (var i = 0; i < 20; i++)
arr = arr.sort(sortFunc);
var k = 0;
sqt = Math.sqrt(num);
for (var i = 0; i < sqt; i++) {
var tr = document.createElement('tr');
table.appendChild(tr);
for (var j = 0; j < sqt; j++) {
var td = document.createElement('td');
td.innerHTML = arr[k].toString();
tr.appendChild(td);
k++;
}
}
</script>
</html>