JS
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.className == 'block'){
if (hod%2 == 0){
event.target.innerHTML = 'X';
}
else{
event.target.innerHTML = '0';
}
hod++;
}
}
}
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="st.css">
<script src = "index.js" defer></script>
</head>
<body>
<div class ="game"></div>
</body>
</html>
CSS
.game{
width: 150px;
height: 150px;
background: orangered;
}
.block{
width: 50px;
height: 50px;
float: left;
border: 1px solid white;
box-sizing: border-box;
line-height: 50px;
text-align: center;
font-size: 40px;
}
