{"id":200996,"date":"2023-11-20T16:19:13","date_gmt":"2023-11-20T16:19:13","guid":{"rendered":"https:\/\/namso-gen.co\/blog\/how-to-change-url-parameter-value-in-javascript\/"},"modified":"2023-11-20T16:19:13","modified_gmt":"2023-11-20T16:19:13","slug":"how-to-change-url-parameter-value-in-javascript","status":"publish","type":"post","link":"https:\/\/namso-gen.co\/blog\/how-to-change-url-parameter-value-in-javascript\/","title":{"rendered":"How to change URL parameter value in JavaScript?"},"content":{"rendered":"

Changing a URL parameter value in JavaScript can be useful when you want to update the query string dynamically. This can be done easily using the URLSearchParams API. Here’s how you can change a URL parameter value in JavaScript:<\/p>\n

**1. Get the current URL:**<\/p>\n

First, you need to get the current URL using the window.location.href property.<\/p>\n

**2. Create a URLSearchParams object:**<\/p>\n

Next, create a new URLSearchParams object by passing in the current URL.<\/p>\n

**3. Set the new parameter value:**<\/p>\n

Use the set() method on the URLSearchParams object to set the new value for the parameter.<\/p>\n

**4. Update the URL:**<\/p>\n

Finally, update the URL with the new parameter value by calling the toString() method on the URLSearchParams object.<\/p>\n

Here’s the code snippet to change a URL parameter value in JavaScript:<\/p>\n

“`javascript
\nlet url = window.location.href;
\nlet urlParams = new URLSearchParams(url);
\nurlParams.set(‘param’, ‘newvalue’);
\nwindow.location.href = window.location.pathname + ‘?’ + urlParams.toString();
\n“`<\/p>\n

By following these steps, you can easily change a URL parameter value in JavaScript and update the query string dynamically.<\/p>\n

\n
\n

Table of Contents<\/p>\nToggle<\/span><\/path><\/svg><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n