Изменение параметров GET в JavaScript без перезагрузки страницы

Чтобы изменить параметр GET в JavaScript без перезагрузки страницы, вы можете использовать несколько методов. Вот несколько часто используемых подходов:

  1. API истории. API истории позволяет управлять историей браузера и изменять URL-адрес без перезагрузки страницы. Вы можете использовать методы pushState()или replaceState()для изменения параметра GET. Например:
// Add or modify a GET parameter
var newUrl = window.location.href.replace(/(\?|&)paramName=([^&]*)/, '$1paramName=newValue');
window.history.pushState('', '', newUrl);
  1. API URLSearchParams. API URLSearchParams предоставляет удобный способ работы с параметрами URL-запроса. Вы можете создать новый объект URLSearchParams, обновить параметр, а затем установить новый URL-адрес, используя window.location.search. Вот пример:
// Update a GET parameter
var searchParams = new URLSearchParams(window.location.search);
searchParams.set('paramName', 'newValue');
var newUrl = window.location.pathname + '?' + searchParams.toString();
window.history.replaceState('', '', newUrl);
  1. Ручное манипулирование URL-адресом. Вы также можете манипулировать строкой URL-адреса вручную, используя регулярные выражения или функции манипулирования строками. Этот подход требует большей осторожности, чтобы убедиться, что URL-адрес отформатирован правильно. Вот пример:
// Modify a GET parameter
var url = window.location.href;
var newUrl = url.replace(/(\?|&)paramName=([^&]*)/, '$1paramName=newValue');
window.history.replaceState('', '', newUrl);