все они вызывают одну функцию. Как мне сделать чтобы по клику на каждую из этих кнопок я мог вызвать функцию?
var btnOpen = document.querySelector('.js-open-modal');
var btnOpen = document.querySelectorAll('.js-open-modal');
И так и так не работает
Потому что нужно у каждой кнопки вызвать addeventlistener
В первом случае ты обработчик вешаешь только на первую кнопку, которую находит querySelector, то есть, которая выше по дом дереву и ток на ней работает обработчик кликов. Во втором случае querySelectorAll возвращает тебе nodelist, ты пытаешься на него повешать обработчик скорее всего, а нужно его итерировать и вашать обработчик на каждый элемент. Либо применить делегацию событий тут уж как
const buttons = document querySelectorAll (...) buttons.forEach button => button addEventListener "click", callback
Обсуждают сегодня