URLを分割し、付与されるパラメータを取得する【JavaScript】

「URLに付与されているパラメータから商品IDだけを取得したい」ということはよくありますよね。

この記事ではパラメーターを分割・整形し、希望のパラメータを取得する方法を紹介します。

splitを使います。

splitで分割する

仮に、http://exmple.com?id=01230123というURLがあったとします。

このURLの01230123だけを取得してみましょう。

ここではJavaScriptのsplitというメソッドを使っていきます。

splitで分割するソースコード

function splitURL(){
  var url ='http://exmple.com?id=01230123';
  var split_url = url.split("=");
  document.getElementById('idInfo').innerHTML = split_url[1]
}

<input type="button" value="分割する" onclick="splitURL()">
<p>ID：<span id="idInfo"></span></p>

ポイントはurl.split("=")です。

splitによって「http://exmple.com?id」「01230123」に分割されます。

split_url[1]を呼び出すことによってIDだけを取得しています。

デモ

上記のコードの実際のデモです。

「現在のページのURL情報を取得・整形するlocation」とあわせて使うと、URLから必要な情報を取得できます。

パラメータが長い場合にも、型さえ決まっていれば、基本的にはsplitを繰り返せば希望の情報は取得できるはずです。