Стоит задача получать данные из адресной строки браузера и вносить их в произвольные DIV, INPUT.
Идентичный пример кредитного кальтуратора магазина: https://stylus.ua/_form/credit/alfa?store_id=1&is_llc=f&ab_type=110&product_id=400364&product_name=iPhone%20%20iPhone%20XS%2064GB%20Gold&product_cost=20543&product_image=https://stylus.ua/thumbs/108x108/f6/f7/839775.jpeg&markup=&cat_name=iPhone&product_url=https://stylus.ua/apple-iphone-xs-64gb-gold-p400364c170.html
Эта ссылка выводится фреймом на сайте и подтягивает все данные.
Нашел на просторах stackoverflow прекрасный скрипт:
function getParameterByName(name, url = window.location.href) {
name = name.replace(/[\[\]]/g, '\\$&');
var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, ' '));
}
// query string: ?product_id=112233&product_name=Product1&product_price=799
var product_id = getParameterByName('product_id'); // "112233"
var product_name = getParameterByName('product_name'); // "Product1"
var product_price = getParameterByName('product_price'); // "799"
Единственное, не понимаю как использовать полеченные данные из скрипта в HTML. Буду очень благодарен за подсказку!
document.querySelector('body').innerHTML = 'Контент';
Дайте элементы куда надо вставить данные.<input type="text" name="price" id="product_price" value=""><div><img class="product-img" src="/catalog/img/.jpg"></div><span class="product-name"></span>
Полагаю нужно в блоки задавать ID для переменных изначально?document.querySelector('#product_price').textContent = product_price