Question

我是一位非常新的网络开发者。我对HTML和CSS很好，我试着学习javascript。我1个月前非常新，我从来没有编写过单行，我已经制作了2或3个网站，但没有一个是JS能力的。

我知道我可以在jquery中做到这一点并且已经，但我想理解它，我希望能够在vanilla javascript中完成它。

所以在这里。我正在为练习制作一个简单的游戏，它所做的就是提出问题，并根据点击事件将显示=无法显示=块的元素更改为两个大的YES或NO按钮。

所以......这个针对yes_button的第一个代码运行正常。出现隐藏和第一个问题（Q1）的说明。 No按钮不起作用，我无法弄清楚为什么，它本质上是针对不同元素的相同代码。

我检查过的事情：元素id /选择器是正确的 camelCase很好，没有未闭合的牙箍，半冒号很好，

是逻辑中的错误吗？

window.onload = function() {

yes_button.onclick= function() {
document.getElementById("instructions").style.display="none";
document.getElementById("q1").style.display="block";

};


no_button.onClick=function() {
document.getElementById("instructions").style.display="none";   
document.getElementById("nointro").style.display="block";

};



};

Answer 1

您可以删除window.onload函数调用。您可以在结束标记之前放置JavaScript导入，以便在尝试单击按钮之前准备好dom。

您的JavaScript事件应如下所示：

document.getElementById("yes_button").onclick = function(){

             document.getElementById("instructions").style.display= "none";
             document.getElementById("q1").style.display = "block";

};


document.getElementById("no_button").onclick = function(){

            document.getElementById("instructions").style.display="none";   
            document.getElementById("nointro").style.display="block";


};

在javascript中隐藏/显示内容

1 个答案: