Bootstrap 5可折叠侧边栏此前正常，当前无法切换

我有一个侧边栏（见截图），点击右上角按钮本应实现侧边栏切换，此前功能正常，现在无法工作。以下是相关代码，恳请协助排查问题。

侧边栏HTML代码 #

<nav id="sidebar">
  <div class="bg-dark h-100" id="sidebar-wrapper">
    <div class="sidebar-heading bg-dark text-light fw-bold newFont2">
      <i class="fa-solid fa-globe me-1"></i> domain.com
    </div>
    <div class="list-group list-group-flush">
      <a class="list-group-item bg-sidebar px-3 py-2" href="https://example.com/company/dashboard" current-page="absolute">
        <i class=" fa-solid fa-house-user text-info "></i>
        <span class="align-middle">Home</span>
      </a>
      <a class="list-group-item bg-sidebar px-3 py-2" href="https://example.com/company/dashboard/reviews">
        <i class=" fa-solid fa-star-half-stroke "></i>
        <span class="align-middle">Reviews</span>
      </a>
      <a class="list-group-item bg-sidebar px-3 py-2" href="https://example.com/company/dashboard/invitations">
        <i class=" fa-solid fa-envelope "></i>
        <span class="align-middle">Invitations</span>
      </a>
      <a class="list-group-item bg-sidebar px-3 py-2" href="https://example.com/company/dashboard/settings">
        <i class=" fa-solid fa-wrench "></i>
        <span class="align-middle">Settings</span>
      </a>
      <div class="border-top my-3" href="#"></div>
      <div class="plan-overview px-3">
        <span class="text-white-50 newFont d-block">Selected plan: <span class="fw-bold text-light">Expert Plan</span>
          <br>Available actions: <span class="fw-bold text-light ">646 left</span>
          <br>
        </span>
      </div>
    </div>
  </div>
</nav>

切换按钮代码 #

<button class="btn navbar-toggler2" id="sidebarToggle"><i class="navbar-toggler-icon"></i></button>

使用的脚本代码 #

/*!
* Start Bootstrap - Simple Sidebar v6.0.3
* Copyright 2013-2021 Start Bootstrap
* Licensed under MIT
*/
window.addEventListener("DOMContentLoaded",(e=>{const t=document.body.querySelector("#sidebarToggle");t&&t.addEventListener("click",(e=>{e.preventDefault(),document.body.classList.toggle("sb-sidenav-toggled"),localStorage.setItem("sb|sidebar-toggle",document.body.classList.contains("sb-sidenav-toggled"))}))}));

排查建议 #

• 确认页面中唯一存在#sidebarToggle按钮，重复ID会导致脚本无法正确绑定点击事件
• 检查脚本加载顺序：确保侧边栏脚本在DOM元素之后加载，或通过DOMContentLoaded确保DOM完全就绪
• 验证页面中存在sb-sidenav-toggled对应的CSS样式，该类是控制侧边栏切换显示的核心，无样式则切换效果不可见
• 打开浏览器开发者工具（F12）的Console标签，查看是否有JS报错（如元素未找到、资源加载失败等）
• 临时注释脚本中的localStorage相关代码，测试功能是否恢复（部分浏览器隐私模式会禁用localStorage）
• 检查是否有其他脚本阻止了#sidebarToggle的点击事件（如调用stopPropagation()或preventDefault()的冲突代码）

内容的提问来源于stack exchange，提问作者Laralex