Cześć Wam!
Mam taki problem, bo chciałbym sprawdzić czy któryś gracz już wykonał zwycięską kombinacje. Wpadałem na pomysł aby dodawać klasę, do wybranego elementu, która by określała czy dane pole jest wybrane przez kółko czy krzyżyk. Problem pojawia się, gdy chcę sprawdzić czy z danej tablicy (gdzie są kolejne tablice, z zwycięskimi kombinacjami), indeksy tych pól mają taką samą klasę.
<body>
<div id="app">
<div id="board">
<div class="field picked-o"><p></p></div>
<div class="field picked-o"><p></p></div>
<div class="field picked-o"><p></p></div>
<div class="field"><p></p></div>
<div class="field"><p></p></div>
<div class="field"><p></p></div>
<div class="field"><p></p></div>
<div class="field"><p></p></div>
<div class="field"><p></p></div>
</div>
</div>
<script>
const fields = document.querySelectorAll('.field');
const winCombinations = [
[0,1,2],
[3,4,5],
[6,7,8],
[0,3,6],
[1,4,7],
[2,5,8],
[0,4,8],
[2,4,6]
];
for (let i = 0; i < winCombinations.length; i++) {
winCombinations[i].forEach((element) => {
if (fields[element].classList.contains('picked-o' || 'picked-x')) {
//jeżeli wszystkie trzy z kombinacji zwrócą true niech zakończy się wykonywanie funkcji
}
});
}
</script>
</body>