Пытаюсь написать игру крестики нолики:
var blockMassive = []
for (let i = 0; i < 9; i++) {
document.getElementById('playing_field').innerHTML+='<div class="block"></div>'
// blockMassive[i] = document.getElementById('playing_field').childNodes[i]
}
blockMassive = document.getElementsByClassName('block')
var turn = 0
document.getElementById('playing_field').onclick = function(event) {
// document.getElementById('playing_field').innerHTML = '1'
// console.log(event)
turn+=1
console.log(event)
if (turn%2 === 1){
if (event.target.innerHTML === 'O') {
turn-=1
alert('Ошибка')
}
else { event.target.innerHTML = 'X'}
}
else { if (event.target.innerHTML === 'X') {
turn-=1
alert('Ошибка')
}
else { event.target.innerHTML = 'O'}}
if (blockMassive[0].innerHTML == 'X' && blockMassive[1].innerHTML == 'X' && blockMassive[2].innerHTML == 'X') {
blockMassive[0].innerHTML += '<img class = "line" src="Line.png" alt="">'
alert('Победили крестики')
}
}
Для проверки, кто победил, я использую массив, состоящий из
<div class="block"></div>, и если я использую
document.getElementsByClassName('block'), то всё работает, а если
blockMassive[i] = document.getElementById('playing_field').childNodes[i]
, то проверка не работает, хотя, как я понимаю и в том, и в другом случае создаётся массив из элементов. Можете, пожалуйста, объяснить почему?
