Как изменять value в поле input динамически?

Question

[Валентин Попов]

Перерыл весь гугл и нечего не нашел.
Допустим у меня есть поле input и кнопка которая увеличивает значение в input. При увеличении я хочу чтобы у меня изменялся value поля input сразу прямиком в html, возможно ли такое?

<input type="number" value="0">
<button id="button" type="button">+</button>

если я делаю вот так, то в html в поле value все равно остается 0, ничего не меняется.

const input  = document.querySelector('input');
const button = document.querySelector('#button');

button.addEventListener('click', function() {
input.value = +input.value + 1;

console.log(input.value);
});

Comments

[Ankhena]

input.value = parseFloat(input.value)+1

[Валентин Попов]

Ankhena, value как был ноль так и останется ноль внутри html

[Ankhena]

Валентин Попов, даже не знаю...
Почему-то у меня всё работает https://codepen.io/AnnaSummer/pen/mdXMazG

[Валентин Попов]

Ankhena, вы откройте исходный код и посмотрите на значение value при клике. Оно у вас постоянно ноль.

[Ankhena]

Валентин Попов, да и ладно. Это из разряда шашечки или ехать. В value нормальное актуально значение.

Если вам прямо зачем-то нужно чтобы менялось в атрибуте, то используйте setAttribute.

Answer 1

[Мелан Альботов]

Надеюсь это поможет.

const input  = document.querySelector('input');
const button = document.querySelector('#button');

button.addEventListener('click', function() {
input.value = Number(input.value) + 1;
input.setAttribute('value', input.value);
console.log(input.value);
});

Comments

[Валентин Попов]

Это работает прекрасно. Спасибо!