Как установить значение поля ввода через JavaScript с помощью querySelector

Мне нужно автоматически заполнить поле почтового индекса на странице оформления заказа с помощью JavaScript.

Я пытался использовать следующий код, но он не работает:

document.querySelector('#checkout-form .address-section div:nth-child(5) input').value = '54321';

Возможно, проблема в том, что элемент загружается динамически или у меня неправильный селектор. Страница загружается через AJAX, поэтому может быть нужно подождать пока форма полностью загрузится.

Какой правильный способ автоматически заполнить значение в поле ввода? Может быть есть более надежный метод чем querySelector? Буду благодарен за помощь с решением этой проблемы.

у меня была такая же проблема с динамическими формами. сначала попробуй простой селектор - возможно структура DOM не такая как ты ожидаешь. я всегда проверяю в консоли браузера что возвращает querySelector, а потом пишу код. если форма грузится через ajax, можешь использовать setInterval - проверяй каждые 100-200мс появился ли элемент, найдешь - заполнишь поле и отключишь. не очень красиво но работает.

Попробуй упростить селектор - вместо длинной цепочки используй input[name=“postal_code”] или по id. Для динамической загрузки проверяй document.readyState - он покажет когда страница готова. И еще - точно ли поле называется postal_code? Может там другой атрибут?

Добавь проверку - элемент существует или нет, перед тем как ставить значение. querySelector часто возвращает null, когда элемент еще не загрузился. Можешь обернуть в setTimeout или лучше взять MutationObserver - он отследит когда форма появится. Еще один способ - повесь обработчик на событие загрузки ajax, если в твоем коде это можно сделать.