Здравствуйте, есть такой код:
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
#game {
padding-left: 15px;
padding-top: 15px;
width: 220px;
height: 220px;
background: orangered;
}
.block {
width: 70px;
height: 70px;
float: left;
border: 1px solid white;
box-sizing: border-box;
line-height: 70px;
text-align: center;
font-size: 50px;
text-transform: uppercase;
}
</style>
</head>
<body>
<div id="game"></div>
<script>
var kvadratiki = [];
pole();
var i;
var j;
function pole() {
for (var i=0; i<3; i++) {
kvadratiki[i]=[];
for (var j=0; j<3; j++) {
kvadratiki[i][j] = 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();
}
}
var n;
var m;
function checkWinner(){
var block = document.getElementsByClassName('block');
for (var n=0; n<i; n++) {
for (var m=0; m<j; m++) {
if (kvadratiki[n][m] == kvadratiki[n+1][m+1] && 'x') {
alert('X WINS')
}
}
}
};
</script>
</body>
</html>
Поле 3 на 3, при нажатии - ставится крестик или нолик, по правилам игры хочу сделать проверку, если в ряд, в столбик, или по диагонали крестики или нолики - выводить алерт. Допустим поле n-ное, оно может быть 3 на 3 или 100 на 100. Хочу сделать проверку.
К примеру поле 3 на 3, получается поле ij:
00 01 02
10 11 12
20 21 22 - вроде правильно обозначил,
не могу догнать как вытащить из этого массива на проверку элементы типа (по диагонали) - [0][0], [1][1], [2][2], получается здесь [i][j],[i+1][j+1] и так далее, беру в учет, если квадратов много.
ну и наподобие в ряд или столбик:
[i][j], [i][j+1]
[i][j], [i+1][j]