Question

我正在尝试存储和检索该类＆＃34; square＆＃34;中所点击的div元素的id和背景颜色。但是，当我尝试打印存储的值时，我得到了“未定义”。

var colorObject = [
    {
        objColor:null,
        squareId:null
    },
    {
        objColor:null,
        squareId:null
    }
];
document.getElementById("container").addEventListener("click", function(e) {
// Event delegation used to find the clicks on the squares within the "Container"
    // e.target was the clicked element
    if (e.target && e.target.matches("div.square")) {
        console.log("Square element clicked!");

        colorObject[0].objColor=this.style.backgroundColor;
        console.log(this.objColor);
        colorObject[0].squareId=this.getAttribute('id');
        console.log(this.squareId);
   }
});

Answer 1

如果您重新审核传递给console.log的内容，您会发现它是this.objColor和this.squareId，这些不是您刚设置的值。将这些更改为colorObject[0].objColor和colorObject[0].squareId，我认为你会有更好的运气：

colorObject[0].objColor=this.style.backgroundColor;
console.log(colorObject[0].objColor);
colorObject[0].squareId=this.getAttribute('id');
console.log(colorObject[0].squareId);

另一方面，与你的间距保持一致是一个很好的做法，上传到SO时要小心，因为有时它会搞砸一些。

在JavaScript对象数组中存储css属性

1 个答案: