New-Bhouse-Web/themes/hugo-universal-theme-master/layouts/shortcodes/furniture_design.html

<section class="bhouseweb_loc_banner">
  <img src="/img/banner/bn_product@2x.png" class="banner-img card-img" alt="...">
</section>
<!-- 手機版型 -->
<div class="mobile-tab d-block d-md-none">
  <div class="row">
    <div class="col-4 m-auto all-tab">
      <a href="/furniture_design/sofa" id="all-design-tab" class="nav-link">全部設計單品</a>
    </div>
  </div>
  <ul class="nav nav-pills mt-0 mt-lg-4 justify-content-center tab-title b-bottom" id="pills-tab" role="tablist">
    <div class="row w-100">
      <div class="col-4">
        <li class="nav-item tab-item" role="presentation">
          <a href="/system_furniture" id="systeam-furniture-tab" class="nav-link">關於系統櫃</a>
        </li>
      </div>
      <div class="col-4">
        <li class="nav-item tab-item" role="presentation">
          <a href="/solid_wood_furniture" id="furniture-tab" class="nav-link">關於家具</a>
        </li>
      </div>
      <div class="col-4">
        <li class="nav-item tab-item" role="presentation">
          <a href="/about_mattress" id="mattress-tab" class="nav-link">關於床墊</a>
        </li>
      </div>
    </div>
  </ul>
</div>
<!-- 電腦版型 -->
<div class="d-none d-md-block">
  <ul class="nav nav-pills mt-0 mt-lg-4 justify-content-center tab-title b-bottom" id="pills-tab" role="tablist">
    <li class="nav-item" role="presentation">
      <a href="/furniture_design/sofa" id="all-design-tab" class="nav-link">全部設計單品</a>
    </li>
    <li class="nav-item tab-item" role="presentation">
      <a href="/system_furniture" id="systeam-furniture-tab" class="nav-link">關於系統櫃</a>
    </li>
    <li class="nav-item tab-item" role="presentation">
      <a href="/solid_wood_furniture" id="furniture-tab" class="nav-link">關於家具</a>
    </li>
    <li class="nav-item tab-item" role="presentation">
      <a href="/about_mattress" id="mattress-tab" class="nav-link">關於床墊</a>
    </li>
  </ul>
</div>

<div class="bhouseweb_loc_content">
  <ul class="design-list mb-3 m-md-0">
    <li><a id="sofa" class="nav-link" href="/furniture_design/sofa/">沙發</a></li>
    <li><a id="side_table" class="nav-link" href="/furniture_design/side_table">茶几</a></li>
    <li><a id="dining_table" class="nav-link" href="/furniture_design/dining_table">餐桌</a></li>
    <li><a id="dining_chair" class="nav-link" href="/furniture_design/dining_chair">餐椅/中島椅</a></li>
    <li><a id="mattress" class="nav-link" href="/furniture_design/mattress/">床組</a></li>
    <li><a id="cabinet" class="nav-link" href="/furniture_design/cabinet">電視櫃</a></li>
    <li><a id="wardrobe" class="nav-link" href="/furniture_design/wardrobe">衣櫃/收納櫃/中島</a></li>
    <li><a id="Side_Cabinet" class="nav-link" href="/furniture_design/side_cabinet">邊櫃/邊几</a></li>
    <li><a id="desk" class="nav-link" href="/furniture_design/desk">書桌/工作桌</a></li>
    <li><a id="other_furniture" class="nav-link" href="/furniture_design/other_furniture">其他設計單品</a></li>
  </ul>
</div>

<div style="border-top: 1px solid grey; position: absolute; width: 100%; left: 0;"></div>

<script>
  // 儲存點擊的 Link ID 後加上 Class Name (預設沙發頁)
  if (window.location.pathname === '/furniture_design/sofa/') {
    localStorage.setItem('assignLink', 'sofa');
  }

  let linkList = document.querySelectorAll(".design-list .nav-link");
  console.log('清單 linkList', linkList);
  for (let i = 0; i < linkList.length; i++) {
    linkList[i].addEventListener("click", function (e) {
      localStorage.setItem('assignLink', e.target.id);
      console.log('e.target.id', e.target.id);
    });
  }

  let linkID = localStorage.getItem('assignLink');
  let link = document.querySelector(`.design-list #${linkID}`);
  link.classList.add("assign-link");

</script>