[解決済み] JavaScriptでクエリ文字列の値を取得するにはどうすればよいですか？

質問

をプラグインレスで取得する方法はありますか？ クエリ文字列 の値を jQuery 経由で（または経ずに）取得できますか？

もしそうなら、どのように？そうでなければ、そうすることができるプラグインはありますか？

どのように解決するのですか？

更新日: 2022年1月

使用方法 Proxy() はより パフォーマン を使用するよりも Object.fromEntries() とサポートが充実しています。

const params = new Proxy(new URLSearchParams(window.location.search), {
  get: (searchParams, prop) => searchParams.get(prop),
});
// Get the value of "some_key" in eg "https://example.com/?some_key=some_value"
let value = params.some_key; // "some_value"

更新日：2021年6月

すべてのクエリパラメータが必要な場合のために。

const urlSearchParams = new URLSearchParams(window.location.search);
const params = Object.fromEntries(urlSearchParams.entries());

更新日：2018年9月

を使用することができます。 URLSearchParams は、シンプルで まともな（完全ではない）ブラウザのサポート .

const urlParams = new URLSearchParams(window.location.search);
const myParam = urlParams.get('myParam');

オリジナル

そのためには、jQueryは必要ありません。純粋なJavaScriptを使えばいいのです。

function getParameterByName(name, url = window.location.href) {
    name = name.replace(/[\[\]]/g, '\\$&');
    var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
        results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, ' '));
}

使用方法

// query string: ?foo=lorem&bar=&baz
var foo = getParameterByName('foo'); // "lorem"
var bar = getParameterByName('bar'); // "" (present with empty value)
var baz = getParameterByName('baz'); // "" (present with no value)
var qux = getParameterByName('qux'); // null (absent)

注：パラメータが複数回存在する場合 ( ?foo=lorem&foo=ipsum ) の場合、最初の値を取得します ( lorem ). これについては標準がなく、使い方は様々です。例えば、この質問をご覧ください。 HTTP GET クエリキーの重複の権威的な位置づけ .

注：この関数は大文字と小文字を区別します。もし、大文字小文字を区別しないパラメータ名を希望する場合は、以下のようになります。 RegExpに'i'修飾子を追加する。

注：no-useless-escape eslintエラーが発生する場合は、次のように置き換えることができます。 name = name.replace(/[\[\]]/g, '\\$&'); で name = name.replace(/[[\]]/g, '\\$&') .

に基づく更新です。 URLSearchParamsの仕様 を使用すると、より簡潔に同じ結果を得ることができます。"と題した回答を参照してください。 URLSearchParams 以下の通りです。