Почему js работает с классами и перестаёт с id?
Потому что классов может быть много а айди должен быть уникальным и один.
В этом случае заметьте
let box = document.getElement s ByClassName('box-text1')[0];
Значит много.

Вот вписывая это.
let box = document.getElementsByClassName('box-text1')[0];
Вы обращаетесь как к массиву.

А у айди уберите и сработает
let box = document.getElementById('box-text1')[0];
getElementById вернёт первый элемент с переданным значением id, а так все элементы:
document.querySelectorAll('#input-form')