it-swarm-id.com

Bagaimana saya bisa mendapatkan nilai string kueri dalam JavaScript?

Apakah ada cara tanpa plugin untuk mengambil string permintaan nilai melalui jQuery (atau tanpa)?

Jika ya, bagaimana caranya? Jika tidak, apakah ada plugin yang dapat melakukannya?

2701
Kemal Emin

Pembaruan: Sep-2018

Anda dapat menggunakan URLSearchParams yang sederhana dan memiliki dukungan browser yang bagus .

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

Asli

Anda tidak perlu jQuery untuk tujuan itu. Anda dapat menggunakan hanya JavaScript murni:

function getParameterByName(name, url) {
    if (!url) 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, ' '));
}

Penggunaan:

// 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)


Catatan: Jika suatu parameter hadir beberapa kali (?foo=lorem&foo=ipsum), Anda akan mendapatkan nilai pertama (lorem). Tidak ada standar tentang ini dan penggunaannya bervariasi, lihat misalnya pertanyaan ini: Posisi otoritatif dari duplikat kunci permintaan GET HTTP .
CATATAN: Fungsi ini case-sensitive. Jika Anda lebih suka nama parameter case-insensitive, tambahkan pengubah 'i' ke RegExp


Ini adalah pembaruan berdasarkan spesifikasi URLSearchParams baru untuk mencapai hasil yang sama secara lebih ringkas. Lihat jawaban berjudul " URLSearchParams " di bawah ini.

7640
Artem Barger

Beberapa solusi yang diposting di sini tidak efisien. Mengulang pencarian ekspresi reguler setiap kali script perlu mengakses parameter sama sekali tidak perlu, satu fungsi tunggal untuk membagi parameter menjadi objek gaya array asosiatif sudah cukup. Jika Anda tidak bekerja dengan API Riwayat HTML 5, ini hanya diperlukan satu kali per halaman dimuat. Saran lain di sini juga gagal memecahkan kode URL dengan benar.

var urlParams;
(window.onpopstate = function () {
    var match,
        pl     = /\+/g,  // Regex for replacing addition symbol with a space
        search = /([^&=]+)=?([^&]*)/g,
        decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); },
        query  = window.location.search.substring(1);

    urlParams = {};
    while (match = search.exec(query))
       urlParams[decode(match[1])] = decode(match[2]);
})();

Querystring contoh:

?i=main&mode=front&sid=de8d49b78a85a322c4155015fdce22c4&enc=+Hello%20&empty

Hasil:

 urlParams = {
    enc: " Hello ",
    i: "main",
    mode: "front",
    sid: "de8d49b78a85a322c4155015fdce22c4",
    empty: ""
}

alert(urlParams["mode"]);
// -> "front"

alert("empty" in urlParams);
// -> true

Ini dapat dengan mudah ditingkatkan untuk menangani string kueri gaya array juga. Contoh dari ini adalah sini , tetapi karena parameter gaya array tidak didefinisikan di RFC 3986 Saya tidak akan mencemari jawaban ini dengan kode sumber. Bagi yang tertarik dengan versi "tercemar", lihat jawaban campbeln di bawah ini .

Juga, sebagaimana ditunjukkan dalam komentar, ; adalah pembatas hukum untuk pasangan key=value. Ini akan membutuhkan regex yang lebih rumit untuk menangani ; atau &, yang menurut saya tidak perlu karena jarang ; digunakan dan saya akan mengatakan lebih tidak mungkin bahwa keduanya akan digunakan. Jika Anda perlu mendukung ; alih-alih &, cukup tukar di regex.


<script>var urlParams = <?php echo json_encode($_GET, JSON_HEX_TAG);?>;</script>

Jauh lebih sederhana!

1666
Andy E

ES2015 (ES6)

getQueryStringParams = query => {
    return query
        ? (/^[?#]/.test(query) ? query.slice(1) : query)
            .split('&')
            .reduce((params, param) => {
                    let [key, value] = param.split('=');
                    params[key] = value ? decodeURIComponent(value.replace(/\+/g, ' ')) : '';
                    return params;
                }, {}
            )
        : {}
};

Tanpa jQuery

var qs = (function(a) {
    if (a == "") return {};
    var b = {};
    for (var i = 0; i < a.length; ++i)
    {
        var p=a[i].split('=', 2);
        if (p.length == 1)
            b[p[0]] = "";
        else
            b[p[0]] = decodeURIComponent(p[1].replace(/\+/g, " "));
    }
    return b;
})(window.location.search.substr(1).split('&'));

Dengan URL seperti ?topic=123&name=query+string, yang berikut ini akan kembali:

qs["topic"];    // 123
qs["name"];     // query string
qs["nothere"];  // undefined (object)

Metode Google

Merobek kode Google, saya menemukan metode yang mereka gunakan: getUrlParameters

function (b) {
    var c = typeof b === "undefined";
    if (a !== h && c) return a;
    for (var d = {}, b = b || k[B][vb], e = b[p]("?"), f = b[p]("#"), b = (f === -1 ? b[Ya](e + 1) : [b[Ya](e + 1, f - e - 1), "&", b[Ya](f + 1)][K](""))[z]("&"), e = i.dd ? ia : unescape, f = 0, g = b[w]; f < g; ++f) {
        var l = b[f][p]("=");
        if (l !== -1) {
            var q = b[f][I](0, l),
                l = b[f][I](l + 1),
                l = l[Ca](/\+/g, " ");
            try {
                d[q] = e(l)
            } catch (A) {}
        }
    }
    c && (a = d);
    return d
}

Itu dikaburkan, tetapi itu bisa dimengerti. Tidak berfungsi karena beberapa variabel tidak terdefinisi.

Mereka mulai mencari parameter pada url dari ? dan juga dari hash #. Kemudian untuk setiap parameter mereka berpisah dalam tanda sama b[f][p]("=") (yang terlihat seperti indexOf, mereka menggunakan posisi char untuk mendapatkan kunci/nilai). Setelah dipecah mereka memeriksa apakah parameter memiliki nilai atau tidak, jika sudah maka mereka menyimpan nilai d, jika tidak mereka hanya melanjutkan.

Pada akhirnya objek d dikembalikan, menangani escaping dan tanda +. Objek ini seperti milik saya, memiliki perilaku yang sama.


Metode saya sebagai plugin jQuery

(function($) {
    $.QueryString = (function(paramsArray) {
        let params = {};

        for (let i = 0; i < paramsArray.length; ++i)
        {
            let param = paramsArray[i]
                .split('=', 2);

            if (param.length !== 2)
                continue;

            params[param[0]] = decodeURIComponent(param[1].replace(/\+/g, " "));
        }

        return params;
    })(window.location.search.substr(1).split('&'))
})(jQuery);

Pemakaian

//Get a param
$.QueryString.param
//-or-
$.QueryString["param"]
//This outputs something like...
//"val"

//Get all params as object
$.QueryString
//This outputs something like...
//Object { param: "val", param2: "val" }

//Set a param (only in the $.QueryString object, doesn't affect the browser's querystring)
$.QueryString.param = "newvalue"
//This doesn't output anything, it just updates the $.QueryString object

//Convert object into string suitable for url a querystring (Requires jQuery)
$.param($.QueryString)
//This outputs something like...
//"param=newvalue&param2=val"

//Update the url/querystring in the browser's location bar with the $.QueryString object
history.replaceState({}, '', "?" + $.param($.QueryString));
//-or-
history.pushState({}, '', "?" + $.param($.QueryString));

Tes kinerja (metode split terhadap metode regex) ( jsPerf )

Kode persiapan: deklarasi metode

Pisahkan kode uji

var qs = window.GetQueryString(query);

var search = qs["q"];
var value = qs["value"];
var undef = qs["undefinedstring"];

Regex kode uji

var search = window.getParameterByName("q");
var value = window.getParameterByName("value");
var undef = window.getParameterByName("undefinedstring");

Pengujian di Firefox 4.0 x86 pada Windows Server 2008 R2/7 x64

  • Metode Split: 144.780 ± 2,17% tercepat
  • Metode Regex​​_: 13.891 ± 0,85% | 90% lebih lambat
1244
BrunoLM

Versi peningkatan dari jawaban Artem Barger :

function getParameterByName(name) {
    var match = RegExp('[?&]' + name + '=([^&]*)').exec(window.location.search);
    return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
}

Untuk informasi lebih lanjut tentang peningkatan, lihat: http://james.padolsey.com/javascript/bujs-1-getparameterbyname/

650
James

URLSearchParams

Firefox 44+, Opera 36+, Edge 17+, Safari 10.3+ dan Chrome 49+ mendukung API URLSearchParams :

Ada polyfill google-disarankanURLSearchParamsuntuk versi IE yang stabil.

Ini tidak distandarisasi oleh W3C , tetapi itu adalah standar hidup oleh WhatWG .

Anda dapat menggunakannya di lokasi, tetapi Anda harus menghapus tanda tanya ? (misalnya, dengan .slice(1)):

let params = new URLSearchParams(location.search);

atau

let params = (new URL(location)).searchParams;

Atau tentu saja di URL apa pun:

let url = new URL('https://example.com?foo=1&bar=2');
let params = new URLSearchParams(url.search);

Anda bisa mendapatkan params juga menggunakan properti .searchParams steno pada objek URL, seperti ini:

let params = new URL('https://example.com?foo=1&bar=2').searchParams;
params.get('foo'); // "1"
params.get('bar'); // "2" 

Anda membaca/mengatur parameter melalui get(KEY), set(KEY, VALUE), append(KEY, VALUE) API. Anda juga dapat mengulangi semua nilai for (let p of params) {}.

Implementasi referensi dan halaman sampel tersedia untuk audit dan pengujian.

541
Paul Sweatte

Hanya rekomendasi lain. PluginPurlmemungkinkan untuk mengambil semua bagian URL, termasuk jangkar, Host, dll.

Ini dapat digunakan dengan atau tanpa jQuery.

Penggunaannya sangat sederhana dan keren:

var url = $.url('http://allmarkedup.com/folder/dir/index.html?item=value'); // jQuery version
var url = purl('http://allmarkedup.com/folder/dir/index.html?item=value'); // plain JS version
url.attr('protocol'); // returns 'http'
url.attr('path'); // returns '/folder/dir/index.html'

Namun, pada 11 November 2014, Purl tidak lagi dipertahankan dan penulis merekomendasikan untuk menggunakan URI.js sebagai gantinya. Plugin jQuery berbeda karena berfokus pada elemen - untuk penggunaan dengan string, cukup gunakan URI secara langsung, dengan atau tanpa jQuery. Kode serupa akan terlihat seperti itu, dokumen lebih lengkap sini :

var url = new URI('http://allmarkedup.com/folder/dir/index.html?item=value'); // plain JS version
url.protocol(); // returns 'http'
url.path(); // returns '/folder/dir/index.html'
398
AlfaTeK

tl; dr

Solusi cepat, selesai , yang menangani kunci multinilai dan karakter yang dikodekan .

var qd = {};
if (location.search) location.search.substr(1).split("&").forEach(function(item) {var s = item.split("="), k = s[0], v = s[1] && decodeURIComponent(s[1]); (qd[k] = qd[k] || []).Push(v)})

//using ES6   (23 characters cooler)
var qd = {};
if (location.search) location.search.substr(1).split`&`.forEach(item => {let [k,v] = item.split`=`; v = v && decodeURIComponent(v); (qd[k] = qd[k] || []).Push(v)})
var qd = {};
if (location.search) location.search.substr(1).split("&").forEach(function(item) {
    var s = item.split("="),
        k = s[0],
        v = s[1] && decodeURIComponent(s[1]); //  null-coalescing / short-circuit
    //(k in qd) ? qd[k].Push(v) : qd[k] = [v]
    (qd[k] = qd[k] || []).Push(v) // null-coalescing / short-circuit
})

Apa semua kode ini ...
"null-coalescing" , evaluasi hubungan pendek
ES6 Penugasan perusakan , Fungsi panah , String templat

"?a=1&b=0&c=3&d&e&a=5&a=t%20e%20x%20t&e=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dståle%26car%3Dsaab"
> qd
a: ["1", "5", "t e x t"]
b: ["0"]
c: ["3"]
d: [undefined]
e: [undefined, "http://w3schools.com/my test.asp?name=ståle&car=saab"]

> qd.a[1]    // "5"
> qd["a"][1] // "5"



Baca lebih lanjut ... tentang solusi JavaScript Vanilla.

Untuk mengakses bagian URL yang berbeda, gunakan location.(search|hash)

Solusi termudah (dummy)

var queryDict = {};
location.search.substr(1).split("&").forEach(function(item) {queryDict[item.split("=")[0]] = item.split("=")[1]})
  • Pegangan kunci kosong benar.
  • Mengganti multi-kunci dengan terakhir nilai ditemukan.
"?a=1&b=0&c=3&d&e&a=5"
> queryDict
a: "5"
b: "0"
c: "3"
d: undefined
e: undefined

Kunci multi-nilai

Pemeriksaan kunci sederhana (item in dict) ? dict.item.Push(val) : dict.item = [val]

var qd = {};
location.search.substr(1).split("&").forEach(function(item) {(item.split("=")[0] in qd) ? qd[item.split("=")[0]].Push(item.split("=")[1]) : qd[item.split("=")[0]] = [item.split("=")[1]]})
  • Sekarang kembali array sebagai gantinya.
  • Nilai akses oleh qd.key[index] atau qd[key][index]
> qd
a: ["1", "5"]
b: ["0"]
c: ["3"]
d: [undefined]
e: [undefined]

Karakter yang dikodekan?

Gunakan decodeURIComponent() untuk pemisahan atau keduanyakedua.

var qd = {};
location.search.substr(1).split("&").forEach(function(item) {var k = item.split("=")[0], v = decodeURIComponent(item.split("=")[1]); (k in qd) ? qd[k].Push(v) : qd[k] = [v]})
"?a=1&b=0&c=3&d&e&a=5&a=t%20e%20x%20t&e=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dståle%26car%3Dsaab"
> qd
a: ["1", "5", "t e x t"]
b: ["0"]
c: ["3"]
d: ["undefined"]  // decodeURIComponent(undefined) returns "undefined" !!!*
e: ["undefined", "http://w3schools.com/my test.asp?name=ståle&car=saab"]



Dari komentar

* !!! Harap dicatat, bahwa decodeURIComponent(undefined) mengembalikan string "undefined". Solusinya terletak pada penggunaan sederhana && , yang memastikan bahwa decodeURIComponent() tidak dipanggil pada nilai yang tidak ditentukan. (Lihat "solusi lengkap" di atas.)

v = v && decodeURIComponent(v);


Jika querystring kosong (location.search == ""), hasilnya agak menyesatkan qd == {"": undefined}. Disarankan untuk memeriksa querystring sebelum meluncurkan fungsi parsing likeso:

if (location.search) location.search.substr(1).split("&").forEach(...)
231
Qwerty

Roshambo di snipplr.com memiliki skrip sederhana untuk mencapai ini yang dijelaskan dalamDapatkan Parameter URL dengan jQuery | Ditingkatkan. Dengan skripnya, Anda juga dapat dengan mudah menarik hanya parameter yang Anda inginkan.

Inilah intinya:

$.urlParam = function(name, url) {
    if (!url) {
     url = window.location.href;
    }
    var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(url);
    if (!results) { 
        return undefined;
    }
    return results[1] || undefined;
}

Kemudian dapatkan parameter Anda dari string kueri.

Jadi jika URL/kueri string adalah xyz.com/index.html?lang=de.

Panggil saja var langval = $.urlParam('lang');, dan Anda sudah mendapatkannya.

UZBEKJON juga memiliki posting blog yang luar biasa,Dapatkan parameter & nilai URL dengan jQuery.

216
brandonjp

Jika Anda menggunakan jQuery, Anda dapat menggunakan perpustakaan, seperti jQuery BBQ: Back Button & Query Library .

... jQuery BBQ menyediakan metode .deparam() lengkap, bersama dengan manajemen status hash, dan string fragmen/kueri menguraikan dan menggabungkan metode utilitas.

Sunting: Menambahkan Contoh Deparam:

 var DeparamExample = function() {
            var params = $.deparam.querystring();

            //nameofparam is the name of a param from url
            //code below will get param if ajax refresh with hash
            if (typeof params.nameofparam == 'undefined') {
                params = jQuery.deparam.fragment(window.location.href);
            }
            
            if (typeof params.nameofparam != 'undefined') {
                var paramValue = params.nameofparam.toString();
                  
            }
        };

Jika Anda hanya ingin menggunakan JavaScript biasa, Anda dapat menggunakan ...

var getParamValue = (function() {
    var params;
    var resetParams = function() {
            var query = window.location.search;
            var regex = /[?&;](.+?)=([^&;]+)/g;
            var match;

            params = {};

            if (query) {
                while (match = regex.exec(query)) {
                    params[match[1]] = decodeURIComponent(match[2]);
                }
            }    
        };

    window.addEventListener
    && window.addEventListener('popstate', resetParams);

    resetParams();

    return function(param) {
        return params.hasOwnProperty(param) ? params[param] : null;
    }

})();​

Karena API Riwayat HTML yang baru dan secara khusus history.pushState() dan history.replaceState(), URL dapat berubah yang akan membuat cache parameter dan nilainya tidak valid.

Versi ini akan memperbarui cache parameter internal setiap kali sejarah berubah.

165
alex

Cukup gunakan dua splits :

function get(n) {
    var half = location.search.split(n + '=')[1];
    return half !== undefined ? decodeURIComponent(half.split('&')[0]) : null;
}

Saya membaca semua jawaban sebelumnya dan lebih lengkap. Tetapi saya pikir itu adalah metode paling sederhana dan lebih cepat. Anda dapat memeriksa di jsPerf benchmark ini

Untuk mengatasi masalah dalam komentar Rup, tambahkan pemisahan bersyarat dengan mengubah baris pertama menjadi dua di bawah. Tetapi akurasi absolut berarti sekarang lebih lambat daripada regexp (lihat jsPerf ).

function get(n) {
    var half = location.search.split('&' + n + '=')[1];
    if (!half) half = location.search.split('?' + n + '=')[1];
    return half !== undefined ? decodeURIComponent(half.split('&')[0]) : null;
}

Jadi, jika Anda tahu Anda tidak akan menemui kasus balasan Rup, ini menang. Kalau tidak, regexp.

Atau jika Anda memiliki kontrol querystring dan dapat menjamin bahwa nilai yang Anda coba dapatkan tidak akan pernah mengandung karakter kode URL apa pun (memiliki nilai ini akan menjadi ide yang buruk) - Anda dapat menggunakan versi opsi 1 yang sedikit lebih sederhana dan mudah dibaca:

    function getQueryStringValueByName(name) {
        var queryStringFromStartOfValue = location.search.split(name + '=')[1];
         return queryStringFromStartOfValue !== undefined ? queryStringFromStartOfValue.split('&')[0] : null;
99
Martin Borthiry

Inilah langkah saya untuk membuat solusi sempurna Andy E menjadi plugin jQuery yang lengkap:

;(function ($) {
    $.extend({      
        getQueryString: function (name) {           
            function parseParams() {
                var params = {},
                    e,
                    a = /\+/g,  // Regex for replacing addition symbol with a space
                    r = /([^&=]+)=?([^&]*)/g,
                    d = function (s) { return decodeURIComponent(s.replace(a, " ")); },
                    q = window.location.search.substring(1);

                while (e = r.exec(q))
                    params[d(e[1])] = d(e[2]);

                return params;
            }

            if (!this.queryStringParams)
                this.queryStringParams = parseParams(); 

            return this.queryStringParams[name];
        }
    });
})(jQuery);

Sintaksnya adalah:

var someVar = $.getQueryString('myParam');

Terbaik dari kedua dunia!

94
Ryan Phelan

Jika Anda melakukan lebih banyak manipulasi URL daripada hanya mengurai query, Anda mungkin menemukan URI.js bermanfaat. Ini adalah perpustakaan untuk memanipulasi URL - dan dilengkapi dengan semua lonceng dan peluit. (Maaf untuk iklan mandiri di sini)

untuk mengubah pertanyaan Anda menjadi peta:

var data = URI('?foo=bar&bar=baz&foo=world').query(true);
data == {
  "foo": ["bar", "world"],
  "bar": "baz"
}

(URI.js juga "memperbaiki" querystrings buruk seperti ?&foo&&bar=baz& ke ?foo&bar=baz)

76
rodneyrehm

Saya suka solusi Ryan Phelan . Tapi saya tidak melihat ada gunanya memperpanjang jQuery untuk itu? Tidak ada penggunaan fungsionalitas jQuery.

Di sisi lain, saya suka fungsi bawaan di Google Chrome: window.location.getParameter.

Jadi mengapa tidak menggunakan ini? Oke, browser lain tidak punya. Jadi mari kita buat fungsi ini jika tidak ada:

if (!window.location.getParameter ) {
  window.location.getParameter = function(key) {
    function parseParams() {
        var params = {},
            e,
            a = /\+/g,  // Regex for replacing addition symbol with a space
            r = /([^&=]+)=?([^&]*)/g,
            d = function (s) { return decodeURIComponent(s.replace(a, " ")); },
            q = window.location.search.substring(1);

        while (e = r.exec(q))
            params[d(e[1])] = d(e[2]);

        return params;
    }

    if (!this.queryStringParams)
        this.queryStringParams = parseParams(); 

    return this.queryStringParams[key];
  };
}

Fungsi ini lebih atau kurang dari Ryan Phelan, tetapi dibungkus berbeda: nama yang jelas dan tidak ada ketergantungan perpustakaan javascript lainnya. Lebih lanjut tentang fungsi ini di blog saya .

59
Anatoly Mironov

Berikut adalah cara cepat untuk mendapatkan objek yang mirip dengan array PHP $ _GET :

function get_query(){
    var url = location.search;
    var qs = url.substring(url.indexOf('?') + 1).split('&');
    for(var i = 0, result = {}; i < qs.length; i++){
        qs[i] = qs[i].split('=');
        result[qs[i][0]] = decodeURIComponent(qs[i][1]);
    }
    return result;
}

Pemakaian:

var $_GET = get_query();

Untuk string kueri x=5&y&z=hello&x=6 ini mengembalikan objek:

{
  x: "6",
  y: undefined,
  z: "hello"
}
53
Paulpro

Tetap sederhana dalam kode JavaScript biasa:

function qs(key) {
    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[key];
}

Sebut saja dari mana saja dalam kode JavaScript:

var result = qs('someKey');
52
Sagiv Ofek

Ini semua adalah jawaban yang bagus, tetapi saya membutuhkan sesuatu yang sedikit lebih kuat, dan saya pikir Anda semua mungkin ingin apa yang saya buat.

Ini adalah metode perpustakaan sederhana yang melakukan pembedahan dan manipulasi parameter URL. Metode statis memiliki sub metode berikut yang dapat dipanggil pada URL subjek:

  • dapatkanHost
  • getPath
  • getHash
  • setHash
  • getParams
  • getQuery
  • setParam
  • getParam
  • hasParam
  • hapusParam

Contoh:

URLParser(url).getParam('myparam1')

var url = "http://www.test.com/folder/mypage.html?myparam1=1&myparam2=2#something";

function URLParser(u){
    var path="",query="",hash="",params;
    if(u.indexOf("#") > 0){
        hash = u.substr(u.indexOf("#") + 1);
        u = u.substr(0 , u.indexOf("#"));
    }
    if(u.indexOf("?") > 0){
        path = u.substr(0 , u.indexOf("?"));
        query = u.substr(u.indexOf("?") + 1);
        params= query.split('&');
    }else
        path = u;
    return {
        getHost: function(){
            var hostexp = /\/\/([\w.-]*)/;
            var match = hostexp.exec(path);
            if (match != null && match.length > 1)
                return match[1];
            return "";
        },
        getPath: function(){
            var pathexp = /\/\/[\w.-]*(?:\/([^?]*))/;
            var match = pathexp.exec(path);
            if (match != null && match.length > 1)
                return match[1];
            return "";
        },
        getHash: function(){
            return hash;
        },
        getParams: function(){
            return params
        },
        getQuery: function(){
            return query;
        },
        setHash: function(value){
            if(query.length > 0)
                query = "?" + query;
            if(value.length > 0)
                query = query + "#" + value;
            return path + query;
        },
        setParam: function(name, value){
            if(!params){
                params= new Array();
            }
            params.Push(name + '=' + value);
            for (var i = 0; i < params.length; i++) {
                if(query.length > 0)
                    query += "&";
                query += params[i];
            }
            if(query.length > 0)
                query = "?" + query;
            if(hash.length > 0)
                query = query + "#" + hash;
            return path + query;
        },
        getParam: function(name){
            if(params){
                for (var i = 0; i < params.length; i++) {
                    var pair = params[i].split('=');
                    if (decodeURIComponent(pair[0]) == name)
                        return decodeURIComponent(pair[1]);
                }
            }
            console.log('Query variable %s not found', name);
        },
        hasParam: function(name){
            if(params){
                for (var i = 0; i < params.length; i++) {
                    var pair = params[i].split('=');
                    if (decodeURIComponent(pair[0]) == name)
                        return true;
                }
            }
            console.log('Query variable %s not found', name);
        },
        removeParam: function(name){
            query = "";
            if(params){
                var newparams = new Array();
                for (var i = 0;i < params.length;i++) {
                    var pair = params[i].split('=');
                    if (decodeURIComponent(pair[0]) != name)
                          newparams .Push(params[i]);
                }
                params = newparams;
                for (var i = 0; i < params.length; i++) {
                    if(query.length > 0)
                        query += "&";
                    query += params[i];
                }
            }
            if(query.length > 0)
                query = "?" + query;
            if(hash.length > 0)
                query = query + "#" + hash;
            return path + query;
        },
    }
}


document.write("Host: " + URLParser(url).getHost() + '<br>');
document.write("Path: " + URLParser(url).getPath() + '<br>');
document.write("Query: " + URLParser(url).getQuery() + '<br>');
document.write("Hash: " + URLParser(url).getHash() + '<br>');
document.write("Params Array: " + URLParser(url).getParams() + '<br>');
document.write("Param: " + URLParser(url).getParam('myparam1') + '<br>');
document.write("Has Param: " + URLParser(url).hasParam('myparam1') + '<br>');

document.write(url + '<br>');

// Remove the first parameter
url = URLParser(url).removeParam('myparam1');
document.write(url + ' - Remove the first parameter<br>');

// Add a third parameter
url = URLParser(url).setParam('myparam3',3);
document.write(url + ' - Add a third parameter<br>');

// Remove the second parameter
url = URLParser(url).removeParam('myparam2');
document.write(url + ' - Remove the second parameter<br>');

// Add a hash
url = URLParser(url).setHash('newhash');
document.write(url + ' - Set Hash<br>');

// Remove the last parameter
url = URLParser(url).removeParam('myparam3');
document.write(url + ' - Remove the last parameter<br>');

// Remove a parameter that doesn't exist
url = URLParser(url).removeParam('myparam3');
document.write(url + ' - Remove a parameter that doesn\"t exist<br>');
46
Bernesto

Dari MDN :

function loadPageVar (sVar) {
  return unescape(window.location.search.replace(new RegExp("^(?:.*[&\\?]" + escape(sVar).replace(/[\.\+\*]/g, "\\$&") + "(?:\\=([^&]*))?)?.*$", "i"), "$1"));
}

alert(loadPageVar("name"));
43
orip

Saya sering menggunakan ekspresi reguler, tetapi tidak untuk itu.

Tampaknya lebih mudah dan lebih efisien bagi saya untuk membaca string kueri sekali di aplikasi saya, dan membangun objek dari semua pasangan kunci/nilai seperti:

var search = function() {
  var s = window.location.search.substr(1),
    p = s.split(/\&/), l = p.length, kv, r = {};
  if (l === 0) {return false;}
  while (l--) {
    kv = p[l].split(/\=/);
    r[kv[0]] = decodeURIComponent(kv[1] || '') || true;
  }
  return r;
}();

Untuk URL seperti http://domain.com?param1=val1&param2=val2 Anda bisa mendapatkan nilainya nanti dalam kode Anda sebagai search.param1 dan search.param2.

39
Mic

Golf kode:

var a = location.search&&location.search.substr(1).replace(/\+/gi," ").split("&");
for (var i in a) {
    var s = a[i].split("=");
    a[i]  = a[unescape(s[0])] = unescape(s[1]);
}

Tampilkan itu!

for (i in a) {
    document.write(i + ":" + a[i] + "<br/>");   
};

Di Mac saya: test.htm?i=can&has=cheezburger tampil

0:can
1:cheezburger
i:can
has:cheezburger
39
shanimal

Metode Roshambo jQuery tidak menangani URL decode

http://snipplr.com/view/26662/get-url-parameters-with-jquery--improved/

Baru saja menambahkan kemampuan itu sambil menambahkan dalam pernyataan kembali

return decodeURIComponent(results[1].replace(/\+/g, " ")) || 0;

Sekarang Anda dapat menemukan Inti yang diperbarui:

$.urlParam = function(name){
var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(window.location.href);
if (!results) { return 0; }
return decodeURIComponent(results[1].replace(/\+/g, " ")) || 0;
}
38
Mohammad Arif
function GET() {
        var data = [];
        for(x = 0; x < arguments.length; ++x)
            data.Push(location.href.match(new RegExp("/\?".concat(arguments[x],"=","([^\n&]*)")))[1])
                return data;
    }


example:
data = GET("id","name","foo");
query string : ?id=3&name=jet&foo=b
returns:
    data[0] // 3
    data[1] // jet
    data[2] // b
or
    alert(GET("id")[0]) // return 3
38
Jet

Saya suka ini (diambil dari jquery-how to.blogspot.co.uk):

// get an array with all querystring values
// example: var valor = getUrlVars()["valor"];
function getUrlVars() {
    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;
}

Bekerja bagus untukku.

36
Tomamais

Inilah hasil edit saya untuk jawaban yang sangat bagus ini - dengan kemampuan tambahan untuk mengurai string kueri dengan kunci tanpa nilai.

var url = 'http://sb.com/reg/step1?param';
var qs = (function(a) {
    if (a == "") return {};
    var b = {};
    for (var i = 0; i < a.length; ++i) {
        var p=a[i].split('=', 2);
        if (p[1]) p[1] = decodeURIComponent(p[1].replace(/\+/g, " "));
        b[p[0]] = p[1];
    }
    return b;
})((url.split('?'))[1].split('&'));

PENTING! Parameter untuk fungsi di baris terakhir berbeda. Itu hanya sebuah contoh bagaimana seseorang dapat mengirimkan URL yang sewenang-wenang padanya. Anda dapat menggunakan baris terakhir dari jawaban Bruno untuk mem-parsing URL saat ini.

Jadi apa sebenarnya yang berubah? Dengan url http://sb.com/reg/step1?param= hasilnya akan sama. Tetapi dengan url http://sb.com/reg/step1?param Solusi Bruno mengembalikan objek tanpa kunci, sedangkan tambang mengembalikan objek dengan nilai param dan undefined.

36
skaurus

Saya membutuhkan objek dari string kueri, dan saya benci banyak kode. Ini mungkin bukan yang paling kuat di alam semesta, tetapi itu hanya beberapa baris kode.

var q = {};
location.href.split('?')[1].split('&').forEach(function(i){
    q[i.split('=')[0]]=i.split('=')[1];
});

URL seperti this.htm?hello=world&foo=bar akan membuat:

{hello:'world', foo:'bar'}
34
tim

Berikut ini versi diperpanjang dari versi "Menangani string-gaya kueri" yang ditautkan oleh Andy E. Memperbaiki bug (?key=1&key[]=2&key[]=3; 1 hilang dan diganti dengan [2,3]), membuat beberapa peningkatan kinerja kecil (re-decoding nilai, menghitung ulang posisi "[", dll.) Dan menambahkan sejumlah perbaikan (difungsikan, dukungan untuk ?key=1&key=2, dukungan untuk pembatas ;). Saya meninggalkan variabel-variabel yang sangat pendek, tetapi menambahkan banyak komentar untuk membuatnya mudah dibaca (oh, dan saya menggunakan kembali v dalam fungsi-fungsi lokal, maaf jika itu membingungkan;).

Ini akan menangani querystring berikut ...

? test = Halo & orang = neek & orang [] = jeff & orang [] = jim & orang [ekstra] = john & test3 & nocache = 1398914891264

... membuatnya menjadi objek yang terlihat seperti ...

{
    "test": "Hello",
    "person": {
        "0": "neek",
        "1": "jeff",
        "2": "jim",
        "length": 3,
        "extra": "john"
    },
    "test3": "",
    "nocache": "1398914891264"
}

Seperti yang dapat Anda lihat di atas, versi ini menangani beberapa ukuran array "salah bentuk", yaitu - person=neek&person[]=jeff&person[]=jim atau person=neek&person=jeff&person=jim karena kunci dapat diidentifikasi dan valid (setidaknya dalam dotNet NameValueCollection.Add ):

Jika kunci yang ditentukan sudah ada dalam instance NameValueCollection contoh, nilai yang ditentukan ditambahkan ke daftar nilai yang dipisahkan koma yang ada dalam bentuk "value1, value2, value3".

Tampaknya juri agak keluar pada tombol berulang karena tidak ada spesifikasi. Dalam hal ini, beberapa kunci disimpan sebagai array (palsu). Tetapi perhatikan bahwa saya jangan memproses nilai berdasarkan koma ke dalam array.

Kode:

getQueryStringKey = function(key) {
    return getQueryStringAsObject()[key];
};


getQueryStringAsObject = function() {
    var b, cv, e, k, ma, sk, v, r = {},
        d = function (v) { return decodeURIComponent(v).replace(/\+/g, " "); }, //# d(ecode) the v(alue)
        q = window.location.search.substring(1), //# suggested: q = decodeURIComponent(window.location.search.substring(1)),
        s = /([^&;=]+)=?([^&;]*)/g //# original regex that does not allow for ; as a delimiter:   /([^&=]+)=?([^&]*)/g
    ;

    //# ma(make array) out of the v(alue)
    ma = function(v) {
        //# If the passed v(alue) hasn't been setup as an object
        if (typeof v != "object") {
            //# Grab the cv(current value) then setup the v(alue) as an object
            cv = v;
            v = {};
            v.length = 0;

            //# If there was a cv(current value), .Push it into the new v(alue)'s array
            //#     NOTE: This may or may not be 100% logical to do... but it's better than loosing the original value
            if (cv) { Array.prototype.Push.call(v, cv); }
        }
        return v;
    };

    //# While we still have key-value e(ntries) from the q(uerystring) via the s(earch regex)...
    while (e = s.exec(q)) { //# while((e = s.exec(q)) !== null) {
        //# Collect the open b(racket) location (if any) then set the d(ecoded) v(alue) from the above split key-value e(ntry) 
        b = e[1].indexOf("[");
        v = d(e[2]);

        //# As long as this is NOT a hash[]-style key-value e(ntry)
        if (b < 0) { //# b == "-1"
            //# d(ecode) the simple k(ey)
            k = d(e[1]);

            //# If the k(ey) already exists
            if (r[k]) {
                //# ma(make array) out of the k(ey) then .Push the v(alue) into the k(ey)'s array in the r(eturn value)
                r[k] = ma(r[k]);
                Array.prototype.Push.call(r[k], v);
            }
            //# Else this is a new k(ey), so just add the k(ey)/v(alue) into the r(eturn value)
            else {
                r[k] = v;
            }
        }
        //# Else we've got ourselves a hash[]-style key-value e(ntry) 
        else {
            //# Collect the d(ecoded) k(ey) and the d(ecoded) sk(sub-key) based on the b(racket) locations
            k = d(e[1].slice(0, b));
            sk = d(e[1].slice(b + 1, e[1].indexOf("]", b)));

            //# ma(make array) out of the k(ey) 
            r[k] = ma(r[k]);

            //# If we have a sk(sub-key), plug the v(alue) into it
            if (sk) { r[k][sk] = v; }
            //# Else .Push the v(alue) into the k(ey)'s array
            else { Array.prototype.Push.call(r[k], v); }
        }
    }

    //# Return the r(eturn value)
    return r;
};
31
Campbeln

Ini adalah fungsi yang saya buat beberapa waktu lalu dan saya cukup senang dengannya. Ini bukan case-sensitive - yang berguna. Juga, jika QS yang diminta tidak ada, itu hanya mengembalikan string kosong.

Saya menggunakan versi terkompresi dari ini. Saya memposting tanpa kompresi untuk tipe pemula untuk lebih menjelaskan apa yang terjadi.

Saya yakin ini bisa dioptimalkan atau dilakukan secara berbeda untuk bekerja lebih cepat, tetapi selalu bekerja dengan baik untuk apa yang saya butuhkan.

Nikmati.

function getQSP(sName, sURL) {
    var theItmToRtn = "";
    var theSrchStrg = location.search;
    if (sURL) theSrchStrg = sURL;
    var sOrig = theSrchStrg;
    theSrchStrg = theSrchStrg.toUpperCase();
    sName = sName.toUpperCase();
    theSrchStrg = theSrchStrg.replace("?", "&") theSrchStrg = theSrchStrg + "&";
    var theSrchToken = "&" + sName + "=";
    if (theSrchStrg.indexOf(theSrchToken) != -1) {
        var theSrchTokenLth = theSrchToken.length;
        var theSrchTokenLocStart = theSrchStrg.indexOf(theSrchToken) + theSrchTokenLth;
        var theLocOfNextAndSign = theSrchStrg.indexOf("&", theSrchTokenLocStart);
        theItmToRtn = unescape(sOrig.substring(theSrchTokenLocStart, theLocOfNextAndSign));
    }
    return unescape(theItmToRtn);
}
31
Clint

Kami baru saja merilis arg.js , sebuah proyek yang ditujukan untuk menyelesaikan masalah ini untuk selamanya. Secara tradisional sudah sangat sulit, tetapi sekarang Anda dapat melakukannya:

var name = Arg.get("name");

atau mendapatkan semuanya:

var params = Arg.all();

dan jika Anda peduli tentang perbedaan antara ?query=true dan #hash=true maka Anda dapat menggunakan metode Arg.query() dan Arg.hash().

27
Mat Ryer

Masalah dengan jawaban teratas pada pertanyaan itu adalah bahwa parameter itu tidak didukung ditempatkan setelah #, tetapi kadang-kadang diperlukan untuk mendapatkan nilai ini juga.

Saya memodifikasi jawaban untuk membiarkannya menguraikan string kueri penuh dengan tanda pagar juga:

var getQueryStringData = function(name) {
    var result = null;
    var regexS = "[\\?&#]" + name + "=([^&#]*)";
    var regex = new RegExp(regexS);
    var results = regex.exec('?' + window.location.href.split('?')[1]);
    if (results != null) {
        result = decodeURIComponent(results[1].replace(/\+/g, " "));
    }
    return result;
};
27
Ph0en1x
function GetQueryStringParams(sParam)
{
    var sPageURL = window.location.search.substring(1);
    var sURLVariables = sPageURL.split('&');

    for (var i = 0; i < sURLVariables.length; i++)
    {
        var sParameterName = sURLVariables[i].split('=');
        if (sParameterName[0] == sParam)
        {
            return sParameterName[1];
        }
    }
}​

Dan ini adalah bagaimana Anda dapat menggunakan fungsi ini dengan asumsi URL-nya

http://dummy.com/?stringtext=jquery&stringword=jquerybyexample

var tech = GetQueryStringParams('stringtext');
var blog = GetQueryStringParams('stringword');
25
gewel
http://someurl.com?key=value&keynovalue&keyemptyvalue=&&keynovalue=nowhasvalue#somehash
  • Pasangan kunci/nilai reguler (?param=value)
  • Kunci tanpa nilai (?param: tidak ada tanda atau nilai yang sama)
  • Kunci dengan nilai kosong (?param=: tanda sama, tetapi tidak ada nilai di sebelah kanan tanda sama)
  • Tombol Berulang (?param=1&param=2)
  • Menghapus Kunci Kosong (?&&: tidak ada kunci atau nilai)

Kode:

  • var queryString = window.location.search || '';
    var keyValPairs = [];
    var params      = {};
    queryString     = queryString.substr(1);
    
    if (queryString.length)
    {
       keyValPairs = queryString.split('&');
       for (pairNum in keyValPairs)
       {
          var key = keyValPairs[pairNum].split('=')[0];
          if (!key.length) continue;
          if (typeof params[key] === 'undefined')
             params[key] = [];
          params[key].Push(keyValPairs[pairNum].split('=')[1]);
       }
    }
    

Cara Menelepon:

  • params['key'];  // returns an array of values (1..n)
    

Keluaran:

  • key            ["value"]
    keyemptyvalue  [""]
    keynovalue     [undefined, "nowhasvalue"]
    
20
vol7ron

Jika Anda menggunakan Browserify, Anda dapat menggunakan modul url dari Node.js:

var url = require('url');

url.parse('http://example.com/?bob=123', true).query;

// returns { "bob": "123" }

Bacaan lebih lanjut: URL Node.js v0.12.2 Manual & Dokumentasi

EDIT: Anda dapat menggunakan URL antarmuka, yang cukup banyak diadopsi di hampir semua browser baru dan jika kode akan dijalankan pada browser lama Anda dapat menggunakan polyfill seperti yang ini . Berikut ini contoh kode tentang cara menggunakan antarmuka URL untuk mendapatkan parameter kueri (alias parameter pencarian)

const url = new URL('http://example.com/?bob=123');
url.searchParams.get('bob'); 

Anda juga dapat menggunakan URLSearchParams untuk itu, ini contoh dari MDN untuk melakukannya dengan URLSearchParams:

var paramsString = "q=URLUtils.searchParams&topic=api";
var searchParams = new URLSearchParams(paramsString);

//Iterate the search parameters.
for (let p of searchParams) {
  console.log(p);
}

searchParams.has("topic") === true; // true
searchParams.get("topic") === "api"; // true
searchParams.getAll("topic"); // ["api"]
searchParams.get("foo") === null; // true
searchParams.append("topic", "webdev");
searchParams.toString(); // "q=URLUtils.searchParams&topic=api&topic=webdev"
searchParams.set("topic", "More webdev");
searchParams.toString(); // "q=URLUtils.searchParams&topic=More+webdev"
searchParams.delete("topic");
searchParams.toString(); // "q=URLUtils.searchParams"
20
nkh

Saya mengembangkan perpustakaan kecil menggunakan teknik yang tercantum di sini untuk membuat solusi drop-in yang mudah digunakan untuk masalah siapa pun; Itu dapat ditemukan di sini:

https://github.com/Nijikokun/query-js

Penggunaan

Mengambil parameter/kunci spesifik:

query.get('param');

Menggunakan pembangun untuk mengambil seluruh objek:

var storage = query.build();
console.log(storage.param);

dan banyak lagi ... periksa tautan github untuk lebih banyak contoh.

Fitur

  1. Caching pada kedua decoding dan parameter
  2. Mendukung string kueri hash #hello?page=3
  3. Mendukung melewati permintaan khusus
  4. Mendukung Parameter Array/Objek user[]="jim"&user[]="bob"
  5. Mendukung manajemen kosong &&
  6. Mendukung parameter deklarasi tanpa nilai name&hello="world"
  7. Mendukung parameter berulang param=1&param=2
  8. Sumber bersih, kompak, dan mudah dibaca 4kb
  9. AMD, Membutuhkan, dukungan Node
20
Nijikokun

One-liner untuk mendapatkan kueri:

var value = location.search.match(new RegExp(key + "=(.*?)($|\&)", "i"))[1];
20
Anoop

Metode jQuery yang sangat ringan:

var qs = window.location.search.replace('?','').split('&'),
    request = {};
$.each(qs, function(i,v) {
    var initial, pair = v.split('=');
    if(initial = request[pair[0]]){
        if(!$.isArray(initial)) {
            request[pair[0]] = [initial]
        }
        request[pair[0]].Push(pair[1]);
    } else {
        request[pair[0]] = pair[1];
    }
    return;
});
console.log(request);

Dan untuk mengingatkan, misalnya? Q

alert(request.q)
17
Roi

Berikut adalah versi saya dari kode parsing string kueri di GitHub .

Ini "diawali" dengan jquery. *, Tetapi fungsi parsing itu sendiri tidak menggunakan jQuery. Ini cukup cepat, tetapi masih terbuka untuk beberapa optimasi kinerja sederhana.

Juga mendukung daftar & hash-tables encoding di URL, seperti:

arr[]=10&arr[]=20&arr[]=100

atau

hash[key1]=hello&hash[key2]=moto&a=How%20are%20you

jQuery.toQueryParams = function(str, separator) {
    separator = separator || '&'
    var obj = {}
    if (str.length == 0)
        return obj
    var c = str.substr(0,1)
    var s = c=='?' || c=='#'  ? str.substr(1) : str; 

    var a = s.split(separator)
    for (var i=0; i<a.length; i++) {
        var p = a[i].indexOf('=')
        if (p < 0) {
            obj[a[i]] = ''
            continue
        }
        var k = decodeURIComponent(a[i].substr(0,p)),
            v = decodeURIComponent(a[i].substr(p+1))

        var bps = k.indexOf('[')
        if (bps < 0) {
            obj[k] = v
            continue;
        } 

        var bpe = k.substr(bps+1).indexOf(']')
        if (bpe < 0) {
            obj[k] = v
            continue;
        }

        var bpv = k.substr(bps+1, bps+bpe-1)
        var k = k.substr(0,bps)
        if (bpv.length <= 0) {
            if (typeof(obj[k]) != 'object') obj[k] = []
            obj[k].Push(v)
        } else {
            if (typeof(obj[k]) != 'object') obj[k] = {}
            obj[k][bpv] = v
        }
    }
    return obj;

}
16
Vadim

Inilah yang saya gunakan:

/**
 * Examples:
 * getUrlParams()['myparam']    // url defaults to the current page
 * getUrlParams(url)['myparam'] // url can be just a query string
 *
 * Results of calling `getUrlParams(url)['myparam']` with various urls:
 * example.com                               (undefined)
 * example.com?                              (undefined)
 * example.com?myparam                       (empty string)
 * example.com?myparam=                      (empty string)
 * example.com?myparam=0                     (the string '0')
 * example.com?myparam=0&myparam=override    (the string 'override')
 *
 * Origin: http://stackoverflow.com/a/23946023/2407309
 */
function getUrlParams (url) {
    var urlParams = {} // return value
    var queryString = getQueryString()
    if (queryString) {
        var keyValuePairs = queryString.split('&')
        for (var i = 0; i < keyValuePairs.length; i++) {
            var keyValuePair = keyValuePairs[i].split('=')
            var paramName = keyValuePair[0]
            var paramValue = keyValuePair[1] || ''
            urlParams[paramName] = decodeURIComponent(paramValue.replace(/\+/g, ' '))
        }
    }
    return urlParams // functions below
    function getQueryString () {
        var reducedUrl = url || window.location.search
        reducedUrl = reducedUrl.split('#')[0] // Discard fragment identifier.
        var queryString = reducedUrl.split('?')[1]
        if (!queryString) {
            if (reducedUrl.search('=') !== false) { // URL is a query string.
                queryString = reducedUrl
            }
        }
        return queryString
    } // getQueryString
} // getUrlParams

Mengembalikan 'menimpa' daripada '0' dalam kasus terakhir membuatnya konsisten dengan PHP. Bekerja di IE7.

12
Vladimir Kornea

Saya lebih suka menggunakan split() daripada Regex untuk operasi ini:

function getUrlParams() {
    var result = {};
    var params = (window.location.search.split('?')[1] || '').split('&');
    for(var param in params) {
        if (params.hasOwnProperty(param)) {
            var paramParts = params[param].split('=');
            result[paramParts[0]] = decodeURIComponent(paramParts[1] || "");
        }
    }
    return result;
}
11
Eneko Alonso

Bagi mereka yang menginginkan metode pendek (dengan keterbatasan):

location.search.split('myParameter=')[1]
10
George

Dapatkan semua parameter querystring termasuk nilai kotak centang (array).

Mempertimbangkan penggunaan yang benar & normal dari parameter GET, hal-hal yang saya lihat hilang, pada sebagian besar fungsi, adalah dukungan untuk array dan menghapus data hash.

Jadi saya menulis fungsi ini:

function qs(a){
 if(!a)return {};
 a=a.split('#')[0].split('&');
 var b=a.length,c={},d,k,v;
 while(b--){
  d=a[b].split('=');
  k=d[0].replace('[]',''),v=decodeURIComponent(d[1]||'');
  c[k]?typeof c[k]==='string'?(c[k]=[v,c[k]]):(c[k].unshift(v)):c[k]=v;
 }
 return c
}

Menggunakan operator steno & loop while--, kinerja harus sangat baik.

Dukungan:

  1. Nilai kosong (kunci =/kunci)
  2. Nilai kunci (kunci = nilai)
  3. Array (key [] = value)
  4. Hash (tag hash terpecah)

Catatan:

Itu tidak mendukung array objek (kunci [kunci] = nilai)

Jika spasi + itu tetap +.

Tambahkan .replace(/\+/g, " ") jika perlu.

Penggunaan:

qs('array[]=1&array[]=2&key=value&empty=&empty2#hash')

Pengembalian:

{
    "empty": "",
    "key": "value",
    "array": [
        "1",
        "2"
    ]
}

Demo:

http://jsfiddle.net/ZQMrt/1/

Info

Jika Anda tidak memahami sesuatu atau Anda tidak dapat membaca fungsinya, tanyakan saja. Saya senang menjelaskan apa yang saya lakukan di sini.

Jika Anda pikir fungsi ini tidak dapat dibaca dan tidak dapat dipelihara, saya senang menulis ulang fungsi untuk Anda, tetapi pertimbangkan bahwa operator steno & bitwise selalu lebih cepat daripada sintaksis standar (mungkin membaca tentang steno dan operator bitwise di ECMA-262 buku atau gunakan mesin pencari favorit Anda). Menulis ulang kode dalam sintaks yang dapat dibaca standar berarti kehilangan kinerja.

10
cocco

Yang ini berfungsi dengan baik

function getQuerystring(key) {
    var query = window.location.search.substring(1);
    var vars = query.split("&");
    for (var i = 0; i < vars.length; i++) {
        var pair = vars[i].split("=");
        if (pair[0] == key) {
            return pair[1];
        }
    }
}

diambil dari sini

9
IT ppl
function getUrlVar(key){
    var result = new RegExp(key + "=([^&]*)", "i").exec(window.location.search); 
    return result && unescape(result[1]) || ""; 
}

https://Gist.github.com/1771618

8
alkos333

Fungsi ini mengubah querystring ke objek seperti JSON, ia juga menangani parameter nilai-kurang dan multi-nilai:

"use strict";
function getQuerystringData(name) {
    var data = { };
    var parameters = window.location.search.substring(1).split("&");
    for (var i = 0, j = parameters.length; i < j; i++) {
        var parameter = parameters[i].split("=");
        var parameterName = decodeURIComponent(parameter[0]);
        var parameterValue = typeof parameter[1] === "undefined" ? parameter[1] : decodeURIComponent(parameter[1]);
        var dataType = typeof data[parameterName];
        if (dataType === "undefined") {
            data[parameterName] = parameterValue;
        } else if (dataType === "array") {
            data[parameterName].Push(parameterValue);
        } else {
            data[parameterName] = [data[parameterName]];
            data[parameterName].Push(parameterValue);
        }
    }
    return typeof name === "string" ? data[name] : data;
}

Kami melakukan pemeriksaan untuk undefined pada parameter[1] karena decodeURIComponent mengembalikan string "tidak terdefinisi" jika variabelnya undefined, dan itu salah.

Pemakaian:

"use strict";
var data = getQuerystringData();
var parameterValue = getQuerystringData("parameterName");
6
Albireo

Coba ini:

String.prototype.getValueByKey = function(k){
    var p = new RegExp('\\b'+k+'\\b','gi');
    return this.search(p) != -1 ? decodeURIComponent(this.substr(this.search(p)+k.length+1).substr(0,this.substr(this.search(p)+k.length+1).search(/(&|;|$)/))) : "";
};

Kemudian menyebutnya seperti ini:

if(location.search != "") location.search.getValueByKey("id");

Anda dapat menggunakan ini untuk cookie juga:

if(navigator.cookieEnabled) document.cookie.getValueByKey("username");

Ini hanya berfungsi untuk string yang memiliki key=value[&|;|$]... tidak akan bekerja pada objek/array.

Jika Anda jangan ingin menggunakan String.prototype ... pindahkan ke fungsi dan berikan string sebagai argumen

6
user981090

Saya menggunakan kode ini (JavaScript) untuk mendapatkan apa yang dilewatkan melalui URL:

function getUrlVars() {
            var vars = {};
            var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
                vars[key] = value;
            });
            return vars;
        }

Kemudian untuk menetapkan nilai ke variabel, Anda hanya perlu menentukan parameter mana yang ingin Anda dapatkan, yaitu jika URL adalah example.com/?I=1&p=2&f=3

Anda dapat melakukan ini untuk mendapatkan nilai:

var getI = getUrlVars()["I"];
var getP = getUrlVars()["p"];
var getF = getUrlVars()["f"];

maka nilainya adalah:

getI = 1, getP = 2 and getF = 3
6
user2579312

Kode berikut akan membuat objek yang memiliki dua metode:

  1. isKeyExist: Periksa apakah ada parameter tertentu
  2. getValue: Dapatkan nilai parameter tertentu.

var QSParam = new function() {
       var qsParm = {};
       var query = window.location.search.substring(1);
       var params = query.split('&');
       for (var i = 0; i < params.length; i++) {
           var pos = params[i].indexOf('=');
           if (pos > 0) {
               var key = params[i].substring(0, pos);
               var val = params[i].substring(pos + 1);
               qsParm[key] = val;
           }
       }
       this.isKeyExist = function(query){
           if(qsParm[query]){
               return true;
           }
           else{
              return false;
           }
       };
       this.getValue = function(query){
           if(qsParm[query])
           {
               return qsParm[query];
           }
           throw "URL does not contain query "+ query;
       }
};
6
Anoop

Fungsi berikut mengembalikan versi objek dari queryString Anda. Anda cukup menulis obj.key1 dan obj.key2 untuk mengakses nilai key1 dan key2 dalam parameter.

function getQueryStringObject()
{
    var querystring = document.location.search.replace('?','').split( '&' );
    var objQueryString={};
    var key="",val="";
    if(typeof querystring == 'undefined')
    {
        return (typeof querystring);
    }
    for(i=0;i<querystring.length;i++)
    {
        key=querystring[i].split("=")[0];
        val=querystring[i].split("=")[1];
        objQueryString[key] = val;
    }
    return objQueryString;
}

Dan untuk menggunakan fungsi ini Anda bisa menulis

var obj= getQueryStringObject();
alert(obj.key1);
5
Imdad

Ini pendapat saya sendiri tentang ini. Fungsi pertama ini menerjemahkan string URL menjadi objek pasangan nama/nilai:

url_args_decode = function (url) {
  var args_enc, el, i, nameval, ret;
  ret = {};
  // use the DOM to parse the URL via an 'a' element
  el = document.createElement("a");
  el.href = url;
  // strip off initial ? on search and split
  args_enc = el.search.substring(1).split('&');
  for (i = 0; i < args_enc.length; i++) {
    // convert + into space, split on =, and then decode 
    args_enc[i].replace(/\+/g, ' ');
    nameval = args_enc[i].split('=', 2);
    ret[decodeURIComponent(nameval[0])]=decodeURIComponent(nameval[1]);
  }
  return ret;
};

Dan sebagai bonus tambahan, jika Anda mengubah beberapa argumen, Anda dapat menggunakan fungsi kedua ini untuk mengembalikan array argumen ke string URL:

url_args_replace = function (url, args) {
  var args_enc, el, name;
  // use the DOM to parse the URL via an 'a' element
  el = document.createElement("a");
  el.href = url;
  args_enc = [];
  // encode args to go into url
  for (name in args) {
    if (args.hasOwnProperty(name)) {
      name = encodeURIComponent(name);
      args[name] = encodeURIComponent(args[name]);
      args_enc.Push(name + '=' + args[name]);
    }
  }
  if (args_enc.length > 0) {
    el.search = '?' + args_enc.join('&');
  } else {
    el.search = '';
  }
  return el.href;
};
5
BMitch

Saya melakukan pustaka URL kecil untuk kebutuhan saya di sini: https://github.com/Mikhus/jsurl

Ini adalah cara yang lebih umum untuk memanipulasi URL dalam JavaScript. Sementara itu sangat ringan (diperkecil dan di-gzip <1 KB) dan memiliki API yang sangat sederhana dan bersih. Dan tidak perlu perpustakaan lain untuk bekerja.

Mengenai pertanyaan awal, sangat mudah dilakukan:

var u = new Url; // Current document URL
// or
var u = new Url('http://user:[email protected]:8080/some/path?foo=bar&bar=baz#anchor');

// Looking for query string parameters
alert( u.query.bar);
alert( u.query.foo);

// Modifying query string parameters
u.query.foo = 'bla';
u.query.woo = ['hi', 'hey']

alert(u.query.foo);
alert(u.query.woo);
alert(u);
5
Mikhus

Jika Anda menginginkan parameter gaya array URL.js mendukung parameter gaya array bersarang secara acak serta indeks string (peta). Ini juga menangani decoding URL.

url.get("val[0]=zero&val[1]=one&val[2]&val[3]=&val[4]=four&val[5][0]=n1&val[5][1]=n2&val[5][2]=n3&key=val", {array:true});
// Result
{
    val: [
        'zero',
        'one',
        true,
        '',
        'four',
        [ 'n1', 'n2', 'n3' ]
    ]
    key: 'val'
}
4
Kevin Cox

Ada banyak solusi untuk mengambil nilai kueri URI, saya lebih suka yang ini karena pendek dan berfungsi dengan baik:

function get(name){
   if(name=(new RegExp('[?&]'+encodeURIComponent(name)+'=([^&]*)')).exec(location.search))
      return decodeURIComponent(name[1]);
}
4
BlueMark

Solusi sederhana dengan JavaScript polos dan ekspresi reguler :

alert(getQueryString("p2"));

function getQueryString (Param) {
    return decodeURI("http://www.example.com/?p1=p11&p2=p2222".replace(new RegExp("^(?:.*[&?]" + encodeURI(Param).replace(/[.+*]/g, "$&") + "(?:=([^&]*))?)?.*$", "i"), "$1"));
}

JsFiddle

4
Saidulu Buchhala

Ada sedikit url utilitas bagus untuk ini dengan beberapa sugaring keren:

http://www.example.com/path/index.html?silly=willy#chucky=cheese

url();            // http://www.example.com/path/index.html?silly=willy#chucky=cheese
url('domain');    // example.com
url('1');         // path
url('-1');        // index.html
url('?');         // silly=willy
url('?silly');    // willy
url('?poo');      // (an empty string)
url('#');         // chucky=cheese
url('#chucky');   // cheese
url('#poo');      // (an empty string)

Lihat lebih banyak contoh dan unduh di sini: https://github.com/websanova/js-url#url

4
Rob

Ini fungsi JavaScript paling sederhana dan kecil untuk mendapatkan nilai parameter String int dari URL

/* THIS FUNCTION IS TO FETCH INT PARAMETER VALUES */

function getParameterint(param) {
            var val = document.URL;
            var url = val.substr(val.indexOf(param))  
            var n=parseInt(url.replace(param+"=",""));
            alert(n); 
}
getParameteraint("page");
getParameteraint("pagee");

/*THIS FUNCTION IS TO FETCH STRING PARAMETER*/
function getParameterstr(param) {
            var val = document.URL;
            var url = val.substr(val.indexOf(param))  
            var n=url.replace(param+"=","");
            alert(n); 
}
getParameterstr("str");

Sumber Dan DEMO: http://bloggerplugnplay.blogspot.in/2012/08/how-to-get-url-parameter-in-javascript.html

4
Code Spy

Ada implementasi yang kuat di sumber Node.js
https://github.com/joyent/node/blob/master/lib/querystring.js

Qs TJ juga mem-parars nested parars
https://github.com/visionmedia/node-querystring

4
clyfe

Jika Anda memiliki Underscore.js atau lodash , cara cepat dan kotor untuk menyelesaikannya adalah:

_.object(window.location.search.slice(1).split('&').map(function (val) { return val.split('='); }));
4
acjay
var getUrlParameters = function (name, url) {
    if (!name) {
        return undefined;
    }

    name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
    url = url || location.search;

    var regex = new RegExp('[\\?&#]' + name + '=?([^&#]*)', 'gi'), result, resultList = [];

    while (result = regex.exec(url)) {
        resultList.Push(decodeURIComponent(result[1].replace(/\+/g, ' ')));
    }

    return resultList.length ? resultList.length === 1 ? resultList[0] : resultList : undefined;
};
4
kayz1

Saya mengambil jawaban ini dan menambahkan dukungan untuk meneruskan URL sebagai parameter; kembali ke window.location.search. Jelas ini berguna untuk mendapatkan parameter string kueri dari URL yang bukan halaman saat ini:

(function($, undef) {
  $.QueryString = function(url) {
    var pairs, qs = null, index, map = {};
    if(url == undef){
      qs = window.location.search.substr(1);
    }else{
      index = url.indexOf('?');
      if(index == -1) return {};
      qs = url.substring(index+1);
    }
    pairs = qs.split('&');
    if (pairs == "") return {};
    for (var i = 0; i < pairs.length; ++i)
    {
      var p = pairs[i].split('=');
      if(p.length != 2) continue;
      map[p[0]] = decodeURIComponent(p[1].replace(/\+/g, " "));
    }
    return map;
  };
})(jQuery);
4
mynameistechno

Saya percaya ini sebagai cara yang akurat dan ringkas untuk mencapai ini (dimodifikasi dari http://css-tricks.com/snippets/javascript/get-url-variables/ ):

function getQueryVariable(variable) {

    var query = window.location.search.substring(1),            // Remove the ? from the query string.
        vars = query.split("&");                                // Split all values by ampersand.

    for (var i = 0; i < vars.length; i++) {                     // Loop through them...
        var pair = vars[i].split("=");                          // Split the name from the value.
        if (pair[0] == variable) {                              // Once the requested value is found...
            return ( pair[1] == undefined ) ? null : pair[1];   // Return null if there is no value (no equals sign), otherwise return the value.
        }
    }

    return undefined;                                           // Wasn't found.

}
4

Ini adalah metode yang sangat sederhana untuk mendapatkan nilai parameter (string kueri)

Gunakan fungsi gV(para_name) untuk mengambil nilainya

var a=window.location.search;
a=a.replace(a.charAt(0),""); //Removes '?'
a=a.split("&");

function gV(x){
 for(i=0;i<a.length;i++){
  var b=a[i].substr(0,a[i].indexOf("="));
  if(x==b){
   return a[i].substr(a[i].indexOf("=")+1,a[i].length)}
3
Ankit_Shah55

Jika Anda tidak ingin menggunakan perpustakaan JavaScript, Anda dapat menggunakan fungsi string JavaScript untuk mengurai window.location. Simpan kode ini dalam file .js eksternal dan Anda dapat menggunakannya berulang-ulang di berbagai proyek.

// Example - window.location = "index.htm?name=bob";

var value = getParameterValue("name");

alert("name = " + value);

function getParameterValue(param)
{
    var url = window.location;
    var parts = url.split('?');
    var params = parts[1].split('&');
    var val = "";

    for ( var i=0; i<params.length; i++)
    {
        var paramNameVal = params[i].split('=');

        if ( paramNameVal[0] == param )
        {
            val = paramNameVal[1];
        }
    }
    return val;
}
3
Robert Bolton

Paling cantik tapi mendasar:

data = {};
$.each(
    location.search.substr(1).split('&').filter(Boolean).map(function(kvpairs){
        return kvpairs.split('=')
    }),
    function(i,values) {
        data[values.shift()] = values.join('=')
    }
);

Itu tidak menangani daftar nilai seperti ?a[]=1&a[]2

3
Damien

Saya merekomendasikan Dar Lessons sebagai plugin yang bagus. Saya telah bekerja dengannya sejak lama. Anda juga dapat menggunakan kode berikut. Jus meletakkan var queryObj = {}; sebelum document.ready dan meletakkan kode di bawah di awal document.ready. Setelah kode ini, Anda dapat menggunakan queryObj["queryObjectName"] untuk objek permintaan apa pun yang Anda miliki

var querystring = location.search.replace('?', '').split('&');
for (var i = 0; i < querystring.length; i++) {
    var name = querystring[i].split('=')[0];
    var value = querystring[i].split('=')[1];
    queryObj[name] = value;
}
2
farnoush resa

Ekspresi terpendek yang mungkin dalam hal ukuran untuk mendapatkan objek permintaan tampaknya:

var params = {};
location.search.substr(1).replace(/([^&=]*)=([^&]*)&?/g,
  function () { params[decodeURIComponent(arguments[1])] = decodeURIComponent(arguments[2]); });

Anda dapat menggunakan elemen A untuk mengurai URI dari string ke dalam komponen location- seperti (untuk menghilangkan #..., misalnya):

var a = document.createElement('a');
a.href = url;
// Parse a.search.substr(1)... as above
2
daluege

Menggunakan:

  $(document).ready(function () {
      var urlParams = {};
      (function () {
          var match,
          pl = /\+/g, // Regex for replacing addition symbol with a space
              search = /([^&=]+)=?([^&]*)/g,
              decode = function (s) {
                  return decodeURIComponent(s.replace(pl, " "));
              },
              query = window.location.search.substring(1);

          while (match = search.exec(query))
              urlParams[decode(match[1])] = decode(match[2]);
      })();
      if (urlParams["q1"] === 1) {
          return 1;
      }

Silakan periksa dan beri tahu saya komentar Anda. Lihat jugaCara mendapatkan nilai querystring menggunakan jQuery.

2
Pushkraj

Ini akan mem-parsing variabelDANarray dari string URL. Tidak menggunakan regex atau perpustakaan eksternal apa pun.

function url2json(url) {
   var obj={};
   function arr_vals(arr){
      if (arr.indexOf(',') > 1){
         var vals = arr.slice(1, -1).split(',');
         var arr = [];
         for (var i = 0; i < vals.length; i++)
            arr[i]=vals[i];
         return arr;
      }
      else
         return arr.slice(1, -1);
   }
   function eval_var(avar){
      if (!avar[1])
          obj[avar[0]] = '';
      else
      if (avar[1].indexOf('[') == 0)
         obj[avar[0]] = arr_vals(avar[1]);
      else
         obj[avar[0]] = avar[1];
   }
   if (url.indexOf('?') > -1){
      var params = url.split('?')[1];
      if(params.indexOf('&') > 2){
         var vars = params.split('&');
         for (var i in vars)
            eval_var(vars[i].split('='));
      }
      else
         eval_var(params.split('='));
   }
   return obj;
}

Contoh:

var url = "http://www.x.com?luckyNums=[31,21,6]&name=John&favFoods=[pizza]&noVal"
console.log(url2json(url));

Keluaran:

[object]
   noVal: ""
   favFoods: "pizza"
   name:     "John"
   luckyNums:
      0: "31"
      1: "21"
      2: "6"
2
Pithikos

Fungsi ini akan mengembalikan objek JavaScript yang diuraikan dengan nilai bersarang sembarang menggunakan rekursi seperlunya.

Berikut ini adalah jsfiddle contoh.

[
  '?a=a',
  '&b=a',
  '&b=b',
  '&c[]=a',
  '&c[]=b',
  '&d[a]=a',
  '&d[a]=x',
  '&e[a][]=a',
  '&e[a][]=b',
  '&f[a][b]=a',
  '&f[a][b]=x',
  '&g[a][b][]=a',
  '&g[a][b][]=b',
  '&h=%2B+%25',
  '&i[aa=b',
  '&i[]=b',
  '&j=',
  '&k',
  '&=l',
  '&abc=foo',
  '&def=%5Basf%5D',
  '&ghi=[j%3Dkl]',
  '&xy%3Dz=5',
  '&foo=b%3Dar',
  '&xy%5Bz=5'
].join('');

Diberikan salah satu contoh tes di atas.

var qs = function(a) {
  var b, c, e;
  b = {};
  c = function(d) {
    return d && decodeURIComponent(d.replace(/\+/g, " "));
  };
  e = function(f, g, h) {
    var i, j, k, l;
    h = h ? h : null;
    i = /(.+?)\[(.+?)?\](.+)?/g.exec(g);
    if (i) {
      [j, k, l] = [i[1], i[2], i[3]]
      if (k === void 0) {
        if (f[j] === void 0) {
          f[j] = [];
        }
        f[j].Push(h);
      } else {
        if (typeof f[j] !== "object") {
          f[j] = {};
        }
        if (l) {
          e(f[j], k + l, h);
        } else {
          e(f[j], k, h);
        }
      }
    } else {
      if (f.hasOwnProperty(g)) {
        if (Array.isArray(f[g])) {
          f[g].Push(h);
        } else {
          f[g] = [].concat.apply([f[g]], [h]);
        }
      } else {
        f[g] = h;
      }
      return f[g];
    }
  };
  a.replace(/^(\?|#)/, "").replace(/([^#&=?]+)?=?([^&=]+)?/g, function(m, n, o) {
    n && e(b, c(n), c(o));
  });
  return b;
};
1
Peter T Bosse II

Ini akan berfungsi ... Anda harus memanggil fungsi ini di mana Anda perlu mendapatkan parameter dengan meneruskan namanya ...

function getParameterByName(name)
{
  name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
  var regexS = "[\\?&]"+name+"=([^&#]*)";
  var regex = new RegExp( regexS );
  var results = regex.exec( window.location.href );
  alert(results[1]);
  if (results == null)
    return "";
  else
    return results[1];
}
1
sonorita

Cepat, mudah, dan cepat:

Fungsi:

function getUrlVar() {
    var result = {};
    var location = window.location.href.split('#');
    var parts = location[0].replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
        result [key] = value;
    });
    return result;
}

Penggunaan:

var varRequest = getUrlVar()["theUrlVarName"];
1
Shlomi Hassid

Berikut ini adalah implementasi prototipe String:

String.prototype.getParam = function( str ){
    str = str.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
    var regex = new RegExp( "[\\?&]*"+str+"=([^&#]*)" );    
    var results = regex.exec( this );
    if( results == null ){
        return "";
    } else {
        return results[1];
    }
}

Contoh panggilan:

var status = str.getParam("status")

str dapat berupa string kueri atau url

1
krisrak

Lihat ini posting atau gunakan ini:

<script type="text/javascript" language="javascript">
    $(document).ready(function()
    {
        var urlParams = {};
        (function ()
        {
            var match,
            pl= /\+/g,  // Regular expression for replacing addition symbol with a space
            search = /([^&=]+)=?([^&]*)/g,
            decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); },
            query  = window.location.search.substring(1);

            while (match = search.exec(query))
                urlParams[decode(match[1])] = decode(match[2]);
        })();

        if (urlParams["q1"] === 1)
        {
            return 1;
        }
    });
</script>
1
soheil bijavar

Melakukan hal ini dengan andal lebih banyak melibatkan daripada yang mungkin dipikirkan orang pada awalnya.

  1. location.search, yang digunakan dalam jawaban lain, rapuh dan harus dihindari - misalnya, kembali kosong jika seseorang mengacaukan dan meletakkan pengidentifikasi #fragment sebelum string ?query.
  2. Ada beberapa cara URL lolos secara otomatis di peramban, yang membuat decodeURIComponent cukup wajib, menurut saya.
  3. Banyak string kueri dihasilkan dari input pengguna, yang berarti asumsi tentang konten URL sangat buruk. Termasuk hal-hal yang sangat mendasar seperti itu setiap kunci unik atau bahkan memiliki nilai.

Untuk mengatasi ini, berikut adalah API yang dapat dikonfigurasi dengan dosis pemrograman defensif yang sehat . Perhatikan bahwa itu dapat dibuat setengah ukuran jika Anda bersedia untuk melakukan hardcode beberapa variabel, atau jika input tidak pernah dapat menyertakan hasOwnProperty, dll.

Versi 1: Mengembalikan objek data dengan nama dan nilai untuk setiap parameter. Ini secara efektif menduplikasi mereka dan selalu menghormati yang pertama ditemukan dari kiri ke kanan.

function getQueryData(url, paramKey, pairKey, missingValue, decode) {

    var query, queryStart, fragStart, pairKeyStart, i, len, name, value, result;

    if (!url || typeof url !== 'string') {
        url = location.href; // more robust than location.search, which is flaky
    }
    if (!paramKey || typeof paramKey !== 'string') {
        paramKey = '&';
    }
    if (!pairKey || typeof pairKey !== 'string') {
        pairKey = '=';
    }
    // when you do not explicitly tell the API...
    if (arguments.length < 5) {
        // it will unescape parameter keys and values by default...
        decode = true;
    }

    queryStart = url.indexOf('?');
    if (queryStart >= 0) {
        // grab everything after the very first ? question mark...
        query = url.substring(queryStart + 1);
    } else {
        // assume the input is already parameter data...
        query = url;
    }
    // remove fragment identifiers...
    fragStart = query.indexOf('#');
    if (fragStart >= 0) {
        // remove everything after the first # hash mark...
        query = query.substring(0, fragStart);
    }
    // make sure at this point we have enough material to do something useful...
    if (query.indexOf(paramKey) >= 0 || query.indexOf(pairKey) >= 0) {
        // we no longer need the whole query, so get the parameters...
        query = query.split(paramKey);
        result = {};
        // loop through the parameters...
        for (i = 0, len = query.length; i < len; i = i + 1) {
            pairKeyStart = query[i].indexOf(pairKey);
            if (pairKeyStart >= 0) {
                name = query[i].substring(0, pairKeyStart);
            } else {
                name = query[i];
            }
            // only continue for non-empty names that we have not seen before...
            if (name && !Object.prototype.hasOwnProperty.call(result, name)) {
                if (decode) {
                    // unescape characters with special meaning like ? and #
                    name = decodeURIComponent(name);
                }
                if (pairKeyStart >= 0) {
                    value = query[i].substring(pairKeyStart + 1);
                    if (value) {
                        if (decode) {
                            value = decodeURIComponent(value);
                        }
                    } else {
                        value = missingValue;
                    }
                } else {
                    value = missingValue;
                }
                result[name] = value;
            }
        }
        return result;
    }
}

Versi 2: Mengembalikan objek peta data dengan dua array panjang identik, satu untuk nama dan satu untuk nilai, dengan indeks untuk setiap parameter. Yang ini mendukung nama duplikat dan sengaja tidak menghapus duplikatnya, karena itu mungkin mengapa Anda ingin menggunakan format ini.

function getQueryData(url, paramKey, pairKey, missingValue, decode) {

   var query, queryStart, fragStart, pairKeyStart, i, len, name, value, result;

   if (!url || typeof url !== 'string') {
       url = location.href; // more robust than location.search, which is flaky
   }
   if (!paramKey || typeof paramKey !== 'string') {
       paramKey = '&';
   }
   if (!pairKey || typeof pairKey !== 'string') {
       pairKey = '=';
   }
   // when you do not explicitly tell the API...
   if (arguments.length < 5) {
       // it will unescape parameter keys and values by default...
       decode = true;
   }

   queryStart = url.indexOf('?');
   if (queryStart >= 0) {
       // grab everything after the very first ? question mark...
       query = url.substring(queryStart + 1);
   } else {
       // assume the input is already parameter data...
       query = url;
   }
   // remove fragment identifiers...
   fragStart = query.indexOf('#');
   if (fragStart >= 0) {
       // remove everything after the first # hash mark...
       query = query.substring(0, fragStart);
   }
   // make sure at this point we have enough material to do something useful...
   if (query.indexOf(paramKey) >= 0 || query.indexOf(pairKey) >= 0) {
       // we no longer need the whole query, so get the parameters...
       query = query.split(paramKey);
       result = {
           names: [],
           values: []
       };
       // loop through the parameters...
       for (i = 0, len = query.length; i < len; i = i + 1) {
           pairKeyStart = query[i].indexOf(pairKey);
           if (pairKeyStart >= 0) {
               name = query[i].substring(0, pairKeyStart);
           } else {
               name = query[i];
           }
           // only continue for non-empty names...
           if (name) {
               if (decode) {
                   // unescape characters with special meaning like ? and #
                   name = decodeURIComponent(name);
               }
               if (pairKeyStart >= 0) {
                   value = query[i].substring(pairKeyStart + 1);
                   if (value) {
                       if (decode) {
                           value = decodeURIComponent(value);
                       }
                   } else {
                       value = missingValue;
                   }
               } else {
                   value = missingValue;
               }
               result.names.Push(name);
               result.values.Push(value);
           }
       }
       return result;
   }

}

1
Seth Holladay

Ini tidak berfungsi untuk saya, saya ingin mencocokkan ?b karena parameter b hadir, dan tidak cocok dengan ?return sebagai parameter r, berikut adalah solusi saya .

window.query_param = function(name) {
  var param_value, params;

  params = location.search.replace(/^\?/, '');
  params = _.map(params.split('&'), function(s) {
    return s.split('=');
  });

  param_value = _.select(params, function(s) {
    return s.first === name;
  })[0];

  if (param_value) {
    return decodeURIComponent(param_value[1] || '');
  } else {
    return null;
  }
};
1
Dorian
// Parse query string
var params = {}, queryString = location.hash.substring(1),
    regex = /([^&=]+)=([^&]*)/g,
    m;
while (m = regex.exec(queryString)) {
    params[decodeURIComponent(m[1])] = decodeURIComponent(m[2]);
}
0