显示div onclick无法正常工作

Question

我正在尝试显示如下所示的幻灯片： - （http://www.w3schools.com/w3css/w3css_slideshow.asp）顶部有人点击“关于我们，但我甚至无法让onclick部分工作。” p>

到目前为止，我有： -

document.querySelector("p").addEventListener("click", function(){
    document.querySelector("div").style.display = "block";
});

#here{
  display: none;
}

  
<div id="here">Slideshow</div>
<p>About Us</p>

但由于某种原因它不起作用。有人能告诉我点击功能有什么问题吗？我尝试给他们每个人个人ID，我不知道还有什么可以尝试。提前感谢您提供的任何帮助。

Answer 1

它应该有效，脚本的位置非常重要，请确保您的脚本是在 DOM 之后定义的。或者您可以在DOMContentLoaded事件中添加脚本。

document.addEventListener("DOMContentLoaded", function(event) { 
  //script here
});

document.querySelector("p").addEventListener("click", function(){
    document.querySelector("div").style.display = "block";
});

#here{display: none;}

<div id="here">Slideshow</div>
<p>About Us</p>