Как осуществить переход по ссылкам меню

Question

Застрял с функционалом для меню на мобильную версию сайта. При нажатии на ссылку должен осуществляться переход на ту часть страницы, которую эта ссылка указывает. Меню при этом должно закрываться. Я добавил addEventListener для ссылки, но на вызов функции откликается только первая (и только она одна) ссылка меню. Подскажите как исправить код, чтобы по клику откликались все ссылки и меню закрывалось.

const headerBurger = document.querySelector('.header__burger');
const headerMenu = document.querySelector('.header__menu');
const headerLink = document.querySelector('.header__link');
const body = document.querySelector('.body');

function doActiveMenu(evt) {
    evt.preventDefault();
    headerBurger.classList.toggle('active');
    headerMenu.classList.toggle('active');
    body.classList.toggle('lock');
}

headerBurger.addEventListener('click', doActiveMenu);
headerLink.addEventListener('click', doActiveMenu);

Answer 1

Задача решилась с помощью метода forEach

const headerBurger = document.querySelector('.header__burger');
const headerMenu = document.querySelector('.header__menu');
const body = document.querySelector('.body');
const headerLink = document.querySelectorAll('.header__link');

function doActiveMenu(evt) {
    evt.preventDefault();
    headerBurger.classList.toggle('active');
    headerMenu.classList.toggle('active');
    body.classList.toggle('lock');
}


headerLink.forEach((element) => {
    element.addEventListener('click', doActiveMenu)
})


headerBurger.addEventListener('click', doActiveMenu);

БЛОГ НА HUSL

Как осуществить переход по ссылкам меню

Ответы (1 шт):