Events 为什么'；单击'；不'；在这种情况下，不能在车身上工作

我试着删除事件，在主体上设置“点击”事件。事件在按钮上工作。但为什么它对身体不起作用呢

window.onload = function(){
var bodyN = document.body,
    bodyS = bodyN.style
bodyS.transition = "all 0s";
bodyS.backgroundColor = localStorage.getItem("bgc")


bodyN.addEventListener("click", function(e){
    console.log(e.target);     // why  doesn't work this when I click on body?
    if (e.target.tagName == "BUTTON") {
        console.log(e);
        bodyS.transition = "";
        bodyS.backgroundColor = e.target.id;
        localStorage.setItem("bgc", e.target.id);
    }
});

})

通过jQuery实现相同的功能：

$(document).ready(function(){
$("body").css("transition", "all 0s" );
$("body").css("backgroundColor", localStorage.getItem("bgc"));

$("body").on("click", "button", function(e){
    console.log(e);
    $("body").css("transition", "" );
    $("body").css("backgroundColor", e.target.id);
    localStorage.setItem("bgc", e.target.id);
}) 

}))

对于jQuery，我使用了“单击”而不是“打开”。下面是一个例子：

$("body").click(function(e){
    console.log(e);
    if(e.target.id == "button"){
        alert('button');
    }
    else{
        alert('body');
    }
});

希望它能帮助你