Javascript dom操作/事件处理程序不起作用

我还在学习这个dom操作，所以我试着让我的按钮在你悬停时有一个阴影

下面是html代码

<nav class="navbar navbar-expand-sm fixed-top" id="myNavbar">
  <div class="navbar-header">
    <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupported" aria-controls="navbarSupported" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
    </button>
  </div>
  <a href="#" class="navbar-brand" id="hello">Navbar</a>
  <!-- Nav content -->
  <div class="collapse navbar-collapse" id="navbarSupport">
    <ul class="nav navbar-nav navbar-left">
      <li class="nav-item">
        <a href="#" class="nav-link active">Home</a>
      </li>
      <li class="nav-item">
        <a href="#" class="nav-link">About</a>
      </li>
      <li class="nav-item">
        <a href="#" class="nav-link">Inspiration</a>
      </li>
    </ul>
    <ul class="nav navbar-nav ml-auto navbar-right">
      <li class="nav-item">
        <a href="#" class="nav-link">Create</a>
      </li>
    </ul>
  </div>
</nav>

btn.addEventListener（'onclick'，（）=>{ 控制台日志（123）；

---

});`

事件的名称是

单击

，而不是

单击

。在为元素的属性赋值时（通常应尽量避免），请使用

onclick

，例如

但在添加侦听器时，请使用

“单击”

字符串

const btn=document.getElementById（'myNavbar'）；
btn.addEventListener（'click'，（）=>{console.log（123）；}）













如果您只想让按钮在悬停时有阴影，您可以使用css。元素：悬停{}

`const btn = document.getElementById('myNavbar');

btn.onclick = () => console.log('foo');