Подскажите, как изменить содержимое input в html?
<div class="ant-input-number-input-wrap">
<input autocomplete="off" role="spinbutton" step="1" class="ant-input-number-input" value="100 000" aria-valuenow="100000">
</div>
const input = document.querySelector('.ant-input-number-input');
input.value = 'new value';
Если редактировать непосредственно в атрибутах (value и aria-valuenow), то в самом input на странице изменения не отображаются (остается значение "100 000"), на сервер возможно уйдет значение из этих атрибутов, но как обновить отображение?
Можно использовать
MutationObserver для наблюдения за изменения значения атрибута aria-valuenow, и сразу менять значение input:
const cb = (mutationsList, observer) => {
for (const mutation of mutationsList) {
if (mutation.type === 'attributes' && mutation.attributeName === 'aria-valuenow') {
mutation.target.value = mutation.target.getAttribute('aria-valuenow');
}
}
}
const input = document.querySelector('.ant-input-number-input');
const observer = new MutationObserver(cb);
observer.observe(input, {attributes: true});