JavaScriptを使用してURLパラメータから特定の値を取得する方法

https://example.com/page?name=John&age=25&occupation=developer

このURLでは、name、age、occupationという3つのパラメータがあります。

JavaScriptを使用してURLパラメータの値を取得するためには、次の手順を実行します。

1. window.location.searchを使用して、現在のURLのクエリストリング部分を取得します。クエリストリングは、URLの?以降の部分です。

const queryString = window.location.search;

2. 取得したクエリストリングを解析して、パラメータと値のペアを取得します。これには、URLSearchParamsオブジェクトを使用します。

const urlParams = new URLSearchParams(queryString);

3. get()メソッドを使用して、特定のパラメータの値を取得します。

const name = urlParams.get('name');
const age = urlParams.get('age');
const occupation = urlParams.get('occupation');

これで、name、age、occupationのそれぞれの値を取得することができます。

なお、URLパラメータは文字列として扱われるため、必要に応じて適切な型に変換する必要があります。例えば、数値として使用する場合はparseInt()を使用して数値に変換します。

以上がJavaScriptを使用してURLパラメータから特定の値を取得する方法の基本的な手順です。これを応用すれば、さまざまなWeb開発のシナリオで役立つことでしょう。