Code Editor

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="robots" content="noindex, follow">
    <title>Document</title>
    <link rel="stylesheet" href="./style.css">
</head>

<body>


    <div class="container">
        <button></button>
        <button></button>
        <button></button>
        <button></button>
        <button></button>
        <button></button>
        <button></button>
        <button></button>
        <button></button>
    </div>

    <script src="./javascript.js"></script>
</body>

</html>

button{
    width:200px;
    height:200px;
    background-color: black;
}

.container{
    display:grid;
    grid-template-columns: 1fr 1fr 1fr;
    width: 600px;
    margin:auto;
}

let turno = 0;
const tablero = [];

const btnPulsado = (e, pos) =>{
    turno ++;
    const btn = e.target;
    const color = turno % 2 ? 'salmon':'paleGreen'
    btn.style.backgroundColor = color;
    tablero[pos] = color;
    if(haGanado())alert('Enhorabuena player ' + color) 
}

const haGanado = () =>{
    if(tablero[0] == tablero[1] && tablero[0] == tablero[2] && tablero[0]){
        return true;
    }else if(tablero[3] == tablero[4] && tablero[3] == tablero[5] && tablero[3]){
        return true;
    }else if(tablero[6] == tablero[7] && tablero[6] == tablero[8] && tablero[6]){
        return true;
    }else if(tablero[0] == tablero[3] && tablero[0] == tablero[6] && tablero[0]){
        return true;
    }else if(tablero[1] == tablero[4] && tablero[1] == tablero[7] && tablero[1]){
        return true;
    }else if(tablero[2] == tablero[5] && tablero[2] == tablero[8] && tablero[2]){
        return true;
    }else if(tablero[0] == tablero[4] && tablero[0] == tablero[8] && tablero[0]){
        return true;
    }else if(tablero[2] == tablero[4] && tablero[2] == tablero[6] && tablero[2]){
        return true;
    }
    return false
}
document.querySelectorAll('button').forEach(
    (obj, i) => obj.addEventListener('click', (e) =>btnPulsado(e, i)));