Как закрыть бургер после скролла?

Question

[Snowfall_Zh]

Код бургера работает как надо, а вот код закрытия бургера после нажатия на одну из кнопок бургера не работает.

Если выбрать один селектор - const burger__btn = document.querySelector('.menu__item-link') - то все работает нормально, бургер закрывается после скролла к первому селектору.
А вот если все селекторы выбрать - const burger__btn = document.querySelectorAll('.menu__item-link') - почему то код перестает работать и не закрывает бургер при клике ни на одну кнопку бургера.

function burgerMenu() {
  const burger = document.querySelector('.burger')
  const menu = document.querySelector('.menu')
  const body = document.querySelector('body')
  const burger__btn = document.querySelectorAll('.menu__item-link')
  burger.addEventListener('click', () => {
    if (!menu.classList.contains('active')) {
      menu.classList.add('active')
      burger.classList.add('active-burger')
      body.classList.add('locked')
      
    } else {
      menu.classList.remove('active')
      burger.classList.remove('active-burger')
      body.classList.remove('locked')
    }
  })
  // Брейкпоинт навбара
  window.addEventListener('resize', () => {
    if (window.innerWidth > 991.98) {
      menu.classList.remove('active')
      burger.classList.remove('active-burger')
      body.classList.remove('locked')
    }
  })
  // Код закрытия бургера
  burger__btn.addEventListener('click', () => {
    menu.classList.remove('active')
    burger.classList.remove('active-burger')
    body.classList.remove('locked')
  })
}
burgerMenu()

Answer 1

[MikUrrey]

Потому что querySelector возвращает один элемент, а querySelectorAll возвращает коллекцию (итерируемый объект типа массива).

const burger__btn = document.querySelectorAll('.menu__item-link');
//...............
for(let i = 0, l = burger__btn.length; i < l; i++)
 burger__btn[i].addEventListener('click',  () => {
    menu.classList.remove('active');
    burger.classList.remove('active-burger');
    body.classList.remove('locked');
 })
}

Comments

[Snowfall_Zh]

Спасибо тебе, было очень познавательно.