Привет 👋
Подскажите как можно уменшить и оптимизировать этот код
const navbarItemElems = document.querySelectorAll('.navbar-item')

navbarItemElems.forEach(item => {
 item.addEventListener('click', event => {
   event.preventDefault()

   for (let i = 0; i < navbarItemElems.length; i++) {
     navbarItemElems[i].classList.remove('active')
   }

   item.classList.add('active')
 })
})

1. click всплывает и ты можешь повесить обработчик на родителя

у тебя все еще будет event.target - кликнутый айтем

вместо цикла можно найти элемент по наличию класса active и убрать его только у него

querySelector в помощь тут

ну и можно проверить наличие класса active на event.target и если он есть не делать ничего

так вроде адекватнее

пробовал без for но не убирало класс, точнее убирало если нажму на сам элемент повторно

пример кода скинь

const burgerMenuElem = document.querySelector('.navbar-burger')
const navbarWrapperElem = document.querySelector('.navbar-wrapper')
const navbarItemElems = document.querySelectorAll('.navbar-item')
const buttonUpElem = document.querySelector('.button-up')

burgerMenuElem.addEventListener('click', event => {
 event.preventDefault()

 burgerMenuElem.classList.toggle('active')
 navbarWrapperElem.classList.toggle('active')
 buttonUpElem.classList.toggle('active')
})

navbarItemElems.forEach(item => {
 item.addEventListener('click', event => {
   event.preventDefault()

   for (let i = 0; i < navbarItemElems.length; i++) {
     navbarItemElems[i].classList.remove('active')
   }

   item.classList.add('active')
 })
})

прости что сюда

точнее так

в см пример кода без цикла

см?

вот этот код

navbarItemElems.forEach(item => {
 item.addEventListener('click', function(event) {
   event.preventDefault()

   item.classList.remove('active')
   this.classList.add('active')
 })
})

вот но он не рабочий

подожди

у тебя тут обрабатывается клик на кнопку

на ссылку