JavaScriptのURLからクエリ文字列を抽出する方法は?
ありがとうございました!
辞書スタイルのコレクションを簡単に構築できます...
function getQueryStrings() {
var assoc = {};
var decode = function (s) { return decodeURIComponent(s.replace(/\+/g, " ")); };
var queryString = location.search.substring(1);
var keyValues = queryString.split('&');
for(var i in keyValues) {
var key = keyValues[i].split('=');
if (key.length > 1) {
assoc[decode(key[0])] = decode(key[1]);
}
}
return assoc;
}
そして、このように使用します...
var qs = getQueryStrings();
var myParam = qs["myParam"];
アドレスバーでURLを参照している場合は、
window.location.search
クエリ文字列部分のみを提供します。これには、先頭に疑問符が含まれることに注意してください。
(たとえば)文字列に保存されているランダムなURLを参照している場合、最初の疑問符のインデックスから始まる部分文字列を取得することで、クエリ文字列を取得できます。
url.substring(url.indexOf("?"))
これは、URLのフラグメント部分の疑問符が適切にエンコードされていることを前提としています。最後にターゲットがある場合(つまり、#の後にDOM要素のidが続く)、それも含まれます。
ここに私が使用する方法があります...
function Querystring() {
var q = window.location.search.substr(1), qs = {};
if (q.length) {
var keys = q.split("&"), k, kv, key, val, v;
for (k = keys.length; k--; ) {
kv = keys[k].split("=");
key = kv[0];
val = decodeURIComponent(kv[1]);
if (qs[key] === undefined) {
qs[key] = val;
} else {
v = qs[key];
if (v.constructor != Array) {
qs[key] = [];
qs[key].Push(v);
}
qs[key].Push(val);
}
}
}
return qs;
}
文字列と配列のオブジェクトを返し、非常にうまく機能するようです。 (単一キーの文字列、複数の値を持つ同じキーの配列。)
以下の機能を簡単に使用する必要があります。
function GetQueryStringByParameter(name) {
name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
results = regex.exec(location.search);
return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
- - 使い方 - -
var QueryString= GetQueryStringByParameter('QueryString');
とても簡単です!
function parseQueryString(){
var assoc = {};
var keyValues = location.search.slice(1).split('&');
var decode = function(s){
return decodeURIComponent(s.replace(/\+/g, ' '));
};
for (var i = 0; i < keyValues.length; ++i) {
var key = keyValues[i].split('=');
if (1 < key.length) {
assoc[decode(key[0])] = decode(key[1]);
}
}
return assoc;
}
ブラウザには URLSearchParams
と呼ばれる新しいAPI があり、クエリ文字列の値を抽出および変更できます。
現在、Firefox 44以降、Chrome 49+およびOpera 36+。
初期化/入力
開始するには、新しいURLSearchParamsオブジェクトを作成します。現在の実装では、「?」を削除する必要がありますクエリ文字列の先頭で、クエリ文字列にslice(1)
を使用して、 Jake Archibaldが示唆するように :
var params = new URLSearchParams(window.location.search.slice(1)); // myParam=12
後の実装では、スライスなしで使用できるはずです。
var params = new URLSearchParams(window.location.search); // myParam=12
Get
.get
メソッドでパラメーターを取得できます:
params.get('myParam'); // 12
セット
パラメータは、.set
を使用して変更できます。
params.set('myParam', 'newValue');
出力
そして、現在のクエリ文字列が再び必要な場合、.toString
メソッドはそれを提供します:
params.toString(); // myParam=newValue
このAPIの他のメソッドのホスト があります。
ポリフィル
ブラウザのサポートはまだかなり薄いため、 Andrea Giammarchiによる小さなポリフィル(<3kB) があります。
私のために働く
function querySt(Key) {
var url = window.location.href;
KeysValues = url.split(/[\?&]+/);
for (i = 0; i < KeysValues.length; i++) {
KeyValue= KeysValues[i].split("=");
if (KeyValue[0] == Key) {
return KeyValue[1];
}
}
}
function GetQString(Key) {
if (querySt(Key)) {
var value = querySt(Key);
return value;
}
}
// Assuming "?post=1234&action=edit"
var urlParams = new URLSearchParams(window.location.search);
console.log(urlParams.has('post')); // true
console.log(urlParams.get('action')); // "edit"
console.log(urlParams.getAll('action')); // ["edit"]
console.log(urlParams.toString()); // "?post=1234&action=edit"
console.log(urlParams.append('active', '1')); // "?post=1234&action=edit&active=1"
これを使用できますJavascript:
function getParameterByName(name) {
var match = RegExp('[?&]' + name + '=([^&]*)').exec(window.location.search);
return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
}
プラグインjQuery-URL-Parserを使用して、アンカー、ホストなどを含むURLのすべての部分を取得することもできます。 。
使い方は非常にシンプルでクールです:
$.url().param("itemID")
james&Alfa経由
私はこの方法を使用しました
function getString()
{
var vars = [], hash;
var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
for(var i = 0; i < hashes.length; i++)
{
hash = hashes[i].split('=');
vars.Push(hash[0]);
vars[hash[0]] = hash[1];
}
return vars;
}
var buisnessArea = getString();