Javascript GETパラメータの取得方法

やり方は簡単。URLからURLSearchParamsオブジェクトを作成し、メソッドを実行すればOK。

仮に下記のようなURLがあったと想定します。

https://saka-en.com/examples/javascript/get-parameter/index.html?id=1&name=ken&mode=admin&mode=write

以下のコードでは、対象URLに対してget、getAll、forEach、entries、keys、valuesのメソッドを実行し、取得した値をコンソールに出力しています。

  // 対象URL
  // https://saka-en.com/examples/javascript/get-parameter/index.html?id=1&name=ken&mode=admin&mode=write

  let url = new URL(window.location.href);// URLを取得
  let params = url.searchParams;// URLSearchParamsオブジェクトを取得

  // getメソッドにて取得
  console.log(params.get('id')); // 1
  console.log(params.get('mode')); // admin

  // getAllメソッドにて取得
  console.log(params.getAll('mode')); // Array(2) ["admim", "write"]

  // forEachメソッドにて取得
  params.forEach(function(value,key) {
    console.log(key + " => " + value); // id => 1, name => ken, mode => admin ,mode => write
  });

  // entriesメソッドにて取得
  let entries = params.entries();
  for ( let entry of entries ) {
    console.log(entry[0] + " => " + entry[1]); // id => 1, name => ken, mode => admin, mode => write
  }

  // keysメソッドにて取得
  let keys = params.keys();
  for ( let key of keys ) {
    console.log(key); // id, name, mode, mode
  }

  // valuesメソッドにて取得
  let values = params.values();
  for ( let value of values ) {
    console.log(value); // 1, ken, admin, write
  }

ふむふむ、割と簡単に取得できました。

JavascriptでGETパラメータを取得する方法を紹介しました。

サンプルページはこちらに用意しているので、参考にどうぞ。