62
64

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

JavaScriptでGETパラメーターを取得する

Last updated at Posted at 2013-08-07

JavaScriptでGETパラメータを取得する関数。
"var getVal = getUrlVars();"とかやると、GETパラメータがObjectで入る。

JavaScript
/**
 *	GETパラメータを配列にして返す
 *	
 *	@return		パラメータのObject
 *
 */
var getUrlVars = function(){
	var vars = {}; 
	var param = location.search.substring(1).split('&');
	for(var i = 0; i < param.length; i++) {
		var keySearch = param[i].search(/=/);
		var key = '';
		if(keySearch != -1) key = param[i].slice(0, keySearch);
		var val = param[i].slice(param[i].indexOf('=', 0) + 1);
		if(key != '') vars[key] = decodeURI(val);
	} 
	return vars; 
}

===[ 修正 1 ]======
@gocho様に指摘頂いた箇所を修正。

fragment identifier(#以降の文字)が考慮されていません。
http://suika.suikawiki.org/~wakaba/wiki/sw/n/%E3%83%95%E3%83%A9%E3%82%B0%E3%83%A1%E3%83%B3%E3%83%88%E8%AD%98%E5%88%A5%E5%AD%90
fragment identifier中に'&'が含まれる場合、正常に動作しません。

また、[a=b=c]というパラメータは、[key:"a" / value:"b=c"]の様に分解されるのが一般的です。

===[ 修正2 ]======
@asahina_dev様に指摘いただいた箇所を修正。

よそでも書いたが queryString 取得は location.search

===[ 修正3 ]======
@gocho様に指摘頂いた箇所を修正。

vars = []; ではなく、 vars = {}; の方が望ましいですね。
非数がオブジェクトキーになるのなら、ArrayではなくObjectを使います。

===[ 修正4 ]======
@asahina_dev様の指摘を修正。

プログラムでつくられる URL
/dir/file.html?name1=1&name2&name3=&
の name2 が
vars['name2'] = 'name2'; になる予感

キーと値の関係性がおかしい場合はObjectを返しません。
ただ、値が空の場合は想定されるので、キーがあって値が無い場合は空の文字列を返します。
例えば、パラメータが
?name1=1&name2&name3=&
の場合、{name1: "1", name3: ""}というObjectが返ってきます。

62
64
8

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
62
64

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?