обычно выводят текущую и плюс минут 3 или 5. Т.е. выводят 15 страницу и 16, 17 и 14 13

Да, вот хотелось бы такого примерно добиться. Может есть примеры кода, как это реализовать?

а как вы получаете данные? Возможно стоит на беке реализовать это?

У меня в распоряжении только общее число.

а текущее?

Текущее?

ну да. Логика приложения какая?

Делаю запрос к api. В свойствах могу указать номер страницы и кол-во выводимых айтемов. Приходит массив айтемов и их общее число

Текущая страница хранится в переменной

https://codepen.io/r8nes/pen/VweaPee

Народ, есть такой кусок проекта.
Проблемы сразу две.
Во-первых, слушатель вешается на null. Хотя в проекте, если я создам функцию, что закомментирована над кодом и заменю все querySelector'ы, то слушатели вешаются(в кодпене не прокатывает). Я гуглил на стекоферфлоу, там много интересных объяснений, но важно ваше мнение, тех кто посильнее и в данном контексте.
И вторая проблема - при втором вызове модального окна, не работает кнопка закрытия. Это тоже особенность слушателя? Пробовал убирать через removeEventListener, но не сработало.

в селекторах нужно указывать как в css (точки/решетки)
Ну и банальное:

<button class = "add-row-button">Нажми меня</button>

а в js

document.querySelector('add-row-btn')

(Разные классы, если что)

и

document.body.insertAdjacentElement(popup);

можно на

document.body.append(popup);

<button class = "add-row-button">Нажми меня</button>

document.querySelector('add-row-btn')

document.body.insertAdjacentElement(popup);

document.body.append(popup);

Блин, стыд. Косяк. Моя ненаблюдательность.

<button class = "add-row-button">Нажми меня</button>

document.querySelector('add-row-btn')

document.body.insertAdjacentElement(popup);

document.body.append(popup);

Тоже можно, но в проекте сложно через append.

Не, никак не могу понять, почему второй раз окно не закрывается.

Какое второе окно?

Основная проблема - вешаю на кнопку "Х", где модальное окно, событие. Открываю  и закрываю окно, затем снова открываю. Второй раз не закрывается. Я полагаю, что второй раз вешается событие и первое не срабатывает. Верно?

ты каждый раз создаешь новую модалку при её вызове. вызывая её 2-й раз у тебя 2 модалки в коде и событие остается на первой

Боже, спасибо. Ну я тупой.

Ну вот немного пересобранный твой вариант
https://codepen.io/Nomikama/pen/abdNJQV

Думаю там есть где оптимизировать, но я уже сонный и мне лень

Сам сижу с задачами с раннего утра. Голова на простые решения не варит. Ещё раз спасибо.