document.querySelector
применяется к одному элементу, если вам необходимо несколько элементов, заюзайте document.querySelectorAll
Потом проверяете количество элементов и крутите цикл.Возможно ли с помощью css/html/svg написать такое приложение без тормозов?
<button data-step="-1">-</button>
<input value="1">
<button data-step="+1">+</button>
const values = [ 1, 2, 4, 6, 8, 10, 12, 16, 20, 24, 32, 48, 56, 64 ];
for (const n of document.querySelectorAll('[data-step]')) {
n.addEventListener('click', onClick);
}
function onClick() {
const input = document.querySelector('input');
const index = +this.dataset.step + values.indexOf(+input.value);
input.value = values[Math.max(0, Math.min(values.length - 1, index))];
}