Как запустить код js при нажатии на кнопку
Есть код, который запускается при обновлении страницы, а нужно, чтобы это происходило после нажатии кнопки
document.addEventListener('DOMContentLoaded', () => {
const menuBtns = document.querySelectorAll('.header-for-992px__nav__ul__li_span');
const drops = document.querySelectorAll('.header-for-992px__nav__ul-menu');
menuBtns.forEach(el => {
el.addEventListener('click', (e) => {
let currentBtn = e.currentTarget;
let drop = currentBtn.closest('.header-for-992px__nav__ul__li').querySelector('.header-for-992px__nav__ul-menu');
menuBtns.forEach(el => {
if(el !== currentBtn){
el.classList.remove('activee');
}
});
drops.forEach(el => {
if(el !== drop){
el.classList.remove('grid-header')
}
})
drop.classList.toggle('grid-header')
currentBtn.classList.toggle('activee');
})
})
document.addEventListener('click', (e) => {
if(!e.target.closest('.header-for-992px__nav')){
menuBtns.forEach(el => {
el.classList.remove('activee');
});
drops.forEach(el => {
el.classList.remove('grid-header')
})
}
})
});
Ответы (1 шт):
Автор решения: SiRanWeb
→ Ссылка
Если я правильно понимаю и задача стоит навесить слушателей при нажатии на кнопку, делаем что-то такое (при условии, что тег <script> расположен в конце body):
// вместо
document.addEventListener('DOMContentLoaded', () => {
// ...
})
// пишем
const button = document.querySelector('.some-button');
button.addEventListener('click', () => {
// ...
})
Если <script> расположен где-то вначале и событие DOMContentLoaded все еще нужно - выносим содержимое в функцию, и ее уже вешаем на кнопку:
const init = () => {
// вся логика из DOMContentLoaded
};
document.addEventListener('DOMContentLoaded', () => {
const button = document.querySelector('.some-button');
button.addEventListener('click', init);
});