addEventListener is not a function

Witam Wszystkich,

Dlaczego dostaję error, że "menuItems.addEventListener is not a function".

https://codepen.io/anon/pen/WVERVa

Chodzi o ekrany ponizej 768px.

to co chcę osiągnąć, to usuniecie klasy fade z

menuItems.addEventListener

bo menuItems to obiekt, który dostajesz przez querySelectorAll: https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelectorAll i zwraca ci obiekt typu NodeList, a widocznie ten obiekt nie ma metody addEventListener. Tu masz dostępne jego metody: https://developer.mozilla.org/en-US/docs/Web/API/NodeList#Methods

Ponieważ:
const menuItems = document.querySelectorAll('.menu-items');
stanowią kolekcję elementów nie zaś pojedynczy element.
wykrywanie zdarzeń można dodawać tylko do elementów nie zaś do ich kolekcji.

Dzięki za odp.

Jakaś podpowiedź jak to ugryźć?

moze jest jakas inna metoda do pobrania tych elementów?

możesz zastosować delegację, tj. podłączyć się zdarzeniem wyżej, do tego elementu: <ul class="nav-links"> i tam łapać element przez właściwość target zdarzenia.

Dzieki za podp. Niestey mam za małą wiedzę aby to ogarnąc. Jeśli komus by się chciało ogarnąć kawałek kody był bym wdzięczny. Wiem, że nie tak wygląda nauka.

Spróbuj tego

const menu = document.getElementById('id');

menu.addEventListener('click', func);

function func(e) 
{
    let clicked = e.target; // e.target zwraca obiekt który został kliknięty
}

konrad951 napisał(a):

Dzieki za podp. Niestey mam za małą wiedzę aby to ogarnąc. Jeśli komus by się chciało ogarnąć kawałek kody był bym wdzięczny. Wiem, że nie tak wygląda nauka.

Masz tam gotowe przykłady w tym linku na MDN, jeśli jednak czujesz, że to za mało, to warto poczytać trochę teorii o tym jak zdarzenia się odpalają, o delegacji zdarzeń (event delegation) - na MDN masz choćby to:
https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Events

bo może po prostu brak ci teorii.