html
html
1
2
3
4
5
6
7
8
9
10
11
12
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="style.css">
<script src="js.js" defer></script>
</head>
<body>
<div id="game"></div>
</body>
</html>
Enter to Rename, Shift+Enter to Preview
css
css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
#game {
width: 150px;
height: 150px;
background: #00ff00;
}
.block {
width: 50px;
height: 50px;
float: left;
border: 1px solid white;
box-sizing: border-box;
line-height: 50px;
text-align: center;
font-size: 40px;
text-transform: uppercase;
}
Enter to Rename, Shift+Enter to Preview
js
js
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
window.onload = function(){
for (var i=0; i<9; i++) {
document.getElementById('game').innerHTML+='<div class="block"></div>';
}
var hod = 0;
document.getElementById('game').onclick = function(event){
console.log(event);
if (event.target.className == 'block'){
if (hod%2==0) {
event.target.innerHTML = 'x';
}
else {
event.target.innerHTML = '0';
}
hod++;
checkWinner();
}
}
function checkWinner(){
var allblock = document.getElementsByClassName('block');
if (allblock[0].innerHTML=='x' && allblock[1].innerHTML=='x' && allblock[2].innerHTML=='x') alert ("победили крестики https://youtu.be/WDk38t7Tejg");
if (allblock[3].innerHTML=='x' && allblock[4].innerHTML=='x' && allblock[5].innerHTML=='x') alert ('Победили крестики');
if (allblock[6].innerHTML=='x' && allblock[7].innerHTML=='x' && allblock[8].innerHTML=='x') alert ('Победили крестики');
if (allblock[0].innerHTML=='x' && allblock[3].innerHTML=='x' && allblock[6].innerHTML=='x') alert ('Победили крестики');
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Laufen