В чём различие между input type text и input type number помимо типа принимаемых значений?

Помимо типа принимаемых значений, между <input type="text"> и <input type="number"> есть несколько отличий:

• Валидация и ограничения: type="number" позволяет задать минимальное (min), максимальное (max) и шаг (step) значения, браузер автоматически проверяет ввод и не позволяет ввести недопустимые символы (например, буквы).

• Отображение на мобильных устройствах: для type="number" обычно показывается цифровая клавиатура, что удобнее для ввода чисел.

• Поведение при вводе: в type="number" нельзя ввести произвольный текст, только цифры, знаки минуса, десятичные точки (в зависимости от локали). В type="text" можно вводить любые символы.

• Получаемое значение в JS: у type="number" значение в input.value всё равно строка, но при попытке преобразовать в число можно получить NaN, если введено пустое значение или некорректное.

• Поддержка специальных элементов управления: у type="number" браузеры могут показывать стрелочки для увеличения/уменьшения значения.

Пример:

<input type="number" min="0" max="10" step="1">

Это поле позволит вводить только целые числа от 0 до 10 включительно.