怎么用javascript onClick function改logo？

Question

hello guys hope you're doing well, im new to front-end and specifically javascript, so im working on a design to train myself, i added a button that onClick changes the menu style, and it worked but i tried changing the logo img src and it didn't work, it changes the img after two clicks and the image used before the click does not appear again when the button unclicked

<script>
  let sidebar = document.querySelector(".sidebar");
  let sidebarBtn = document.querySelector(".sidebarBtn");
  sidebarBtn.onclick = function () {
    sidebar.classList.toggle("active");
    if (sidebar.classList.contains("active")) {
      sidebarBtn.classList.replace("bx-menu", "bx-menu-alt-right");
      document.getElementById("img").src = "mdn-logo.png";
    } else {
        sidebarBtn.classList.replace("bx-menu-alt-right", "bx-menu");
    }
  };
</script>

Answer 1

I think you're probably looking for the mouseup event, if that's what you mean by "unclick".

https://developer.mozilla.org/en-US/docs/Web/API/Element/mouseup_event

Also, please refrain from using Element.onclick as it's quite outdated and deprecated. Instead, learn to use Element.addEventListener . You have more options and it's easier to manage as well. Read more on MDN .