URLに含まれるGETパラメータを取得する

URLからGETパラメータを取得する

URLからGETパラメータを取得するときは、URLからURLSearchParamsオブジェクトを作成してメソッドを実行することで取得することができます。

URLSearchParamsオブジェクトはGETパラメータを取得するメソッドが6種類用意されています。

以下の例は、対象URLに対してそれぞれのメソッドを実行し、取得した値をコンソールに出力します。
DEMOページより下記コードの実行例を確認できます（ブラウザのコンソールよりconsole.logの出力を確認してください）。

index.js

// 対象URL：https://gray-code.com/js_sample/url1.html?id=5&username=taro&mode=read&aid=gc39195&mode=premium&mode=testuser

// URLを取得
let url = new URL(window.location.href);

// URLSearchParamsオブジェクトを取得
let params = url.searchParams;

// getメソッド
console.log(params.get('id')); // 5
console.log(params.get('mode')); // read

// getAllメソッド
console.log(params.getAll('mode'));
// (3) ["read", "premium", "testuser"]

// forEachメソッド
params.forEach(function(value,key){
	console.log(key + " => " + value);
});
// id => 5
// username => taro
// mode => read
// aid => gc39195
// mode => premium
// mode => testuser

// entriesメソッド
let entries = params.entries();
for(let entry of entries) {
	console.log(entry[0] + " => " + entry[1]);
}
// id => 5
// username => taro
// mode => read
// aid => gc39195
// mode => premium
// mode => testuser

// keysメソッド
let keys = params.keys();
for(let key of keys) {
	console.log(key);
}
// id
// username
// mode
// aid
// mode
// mode

// valuesメソッド
let values = params.values();
for(let value of values) {
	console.log(value);
}
// 5
// taro
// read
// gc39195
// premium
// testuser

こちらの記事は役に立ちましたか？

コメントありがとうございます！
運営の参考にさせていただきます。