尝试定位某人在Vanilla JS中单击的属性

Question

我正在用JavaScript制作井字游戏，我需要弄清楚如何针对播放器单击的特定属性以防止X和O重叠的功能。

const fillerX = {
    fillX1: document.getElementById('fillerX1'),
    fillX2: document.getElementById('fillerX2'),
    fillX3: document.getElementById('fillerX3'),
    fillX4: document.getElementById('fillerX4'),
    fillX5: document.getElementById('fillerX5'),
    fillX6: document.getElementById('fillerX6'),
    fillX7: document.getElementById('fillerX7'),
    fillX8: document.getElementById('fillerX8'),
    fillX9: document.getElementById('fillerX9')
};

const fillerO = {
    fillO1: document.getElementById('fillerO1'),
    fillO2: document.getElementById('fillerO2'),
    fillO3: document.getElementById('fillerO3'),
    fillO4: document.getElementById('fillerO4'),
    fillO5: document.getElementById('fillerO5'),
    fillO6: document.getElementById('fillerO6'),
    fillO7: document.getElementById('fillerO7'),
    fillO8: document.getElementById('fillerO8'),
    fillO9: document.getElementById('fillerO9')
};


function noLap(){
    if (fillerO.target.style.display="block" || fillerX.target.style.display="block"){
        console.log("it worked!!");
    };
};

Answer 1

在event.target函数中使用onclick：

function clickHandler(event) {
    var clickedBox = event.target; //This will be the thing the user clicked on
    //Do something with clickedBox
}