javascript - querystring - url js




如何在JavaScript中獲取查詢字符串值? (20)

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;
                }, {}
            )
        : {}
};

沒有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('&'));

使用類似?topic=123&name=query+string的URL,將返回以下內容:

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

谷歌方法

撕毀谷歌的代碼我找到了他們使用的方法: 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
}

它是混淆的,但它是可以理解的。 它不起作用,因為某些變量未定義。

他們開始在網址上查找參數? 還有哈希# 。 然後對於每個參數,它們在等號b[f][p]("=")分割(看起來像indexOf ,它們使用char的位置來獲得鍵/值)。 拆分後,檢查參數是否有值,如果有,則存儲d的值,否則只是繼續。

最後返回對象d ,處理轉義和+符號。 這個對象就像我的一樣,它具有相同的行為。

我作為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);

用法

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

性能測試(針對正則表達式方法的拆分方法)jsPerf

準備代碼:方法聲明

拆分測試代碼

var qs = window.GetQueryString(query);

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

正則表達式測試代碼

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

在Windows Server 2008 R2 / 7 x64上的Firefox 4.0 x86中進行測試

  • 分割方法 :最快144,780±2.17%
  • 正則表達式方法 :13,891±0.85%| 慢了90%

是否有一種無插件的方式通過jQuery(或沒有)檢索查詢字符串值?

如果是這樣,怎麼樣? 如果沒有,是否有插件可以這樣做?


URLSearchParams

Firefox 44 +,Opera 36 +,Edge 17 +,Safari 10.3+和Chrome 49+支持URLSearchParams API:

對於IE的穩定版本,有一個谷歌建議的URLSearchParams polyfill

它沒有被W3C標準化,但它是WhatWG的生活標準。

你可以在現場使用它,但你需要刪除? 問號(例如,使用.slice(1) ):

let params = new URLSearchParams(location.search);

要么

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

或者當然在任何URL上:

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

你也可以使用URL對像上的簡寫.searchParams屬性來獲取params,如下所示:

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

您可以通過get(KEY)set(KEY, VALUE)append(KEY, VALUE) API讀取/設置參數。 您還可以迭代for (let p of params) {}所有值。

參考實現示例頁面可用於審計和測試。


snipplr.com上的Roshambo有​​一個簡單的腳本來實現在使用jQuery獲取URL參數中描述的內容 改進了 。 使用他的腳本,您也可以輕鬆獲得所需的參數。

這是要點:

$.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;
}

然後從查詢字符串中獲取參數。

因此,如果URL /查詢字符串是xyz.com/index.html?lang=de

只需調用var langval = $.urlParam('lang'); ,你已經明白了。

UZBEKJON也有一篇很棒的博客文章, 用jQuery獲取URL參數和值


更新:2018年9月

您可以使用URLSearchParams,它很簡單並且具有良好的瀏覽器支持

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

一部開拓創新

你不需要為此目的使用jQuery。 您只能使用一些純JavaScript:

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, ' '));
}

用法:

// 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查詢鍵的權威位置
注意:該功能區分大小寫。 如果您更喜歡不區分大小寫的參數名稱, 請將“i”修飾符添加到RegExp

這是基於新的URLSearchParams規範的更新,以更簡潔地實現相同的結果。 請參閱下面標題為“ URLSearchParams ”的答案。


代碼高爾夫:

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]);
}

顯示它!

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

在我的Mac上:test.htm?i=can&has=cheezburger顯示

0:can
1:cheezburger
i:can
has:cheezburger

只是另一個建議。 插件Purl允許檢索URL的所有部分,包括錨點,主機等。

它可以與jQuery一起使用或不與jQuery一起使用。

用法很簡單,很酷:

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'

但是,截至2014年11月11日,不再維護URI.js ,作者建議使用URI.js jQuery插件的不同之處在於它專注於元素 - 用於字符串,只需直接使用URI ,有或沒有jQuery。 類似的代碼看起來像這樣,更全面的文檔:

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'

在簡單的JavaScript代碼中保持簡單:

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];
}

從JavaScript代碼中的任何位置調用它:

var result = qs('someKey');

如果您使用的是jQuery,則可以使用庫,例如jQuery BBQ:Back Button&Query Library

... jQuery BBQ提供了一個完整的.deparam()方法,以及散列狀態管理和片段/查詢字符串解析和合併實用程序方法。

編輯:添加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();
                  
            }
        };

如果你只想使用純JavaScript,你可以使用......

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;
    }

})();​

由於新的HTML History API,特別是history.pushState()history.replaceState() ,URL可以更改,這將使參數及其值的緩存無效。

每次歷史記錄更改時,此版本都將更新其參數的內部緩存。


我喜歡Ryan Phelan的解決方案 。 但我沒有看到任何擴展jQuery的意義嗎? 沒有使用jQuery功能。

另一方面,我喜歡谷歌瀏覽器中的內置功能:window.location.getParameter。

那麼為什麼不使用這個呢? 好的,其他瀏覽器沒有。 所以,如果它不存在,讓我們創建這個函數:

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];
  };
}

這個函數或多或少來自Ryan Phelan,但它的包裝方式不同:清晰的名稱和其他javascript庫的依賴關係。 在我的博客上有關此功能的更多信息


我經常使用正則表達式,但不是那樣。

在我的應用程序中讀取一次查詢字符串似乎更容易,更有效,並從所有鍵/值對構建對象,如:

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;
}();

對於URL像http://domain.com?param1=val1&param2=val2你之後能得到它們的價值在你的代碼search.param1search.param2


這些都是很好的答案,但我需要更強大的東西,並認為你們都希望擁有我創造的東西。

這是一個簡單的庫方法,可以解析和操作URL參數。 靜態方法具有以下可在主題URL上調用的子方法:

  • 和getHost
  • 的getPath
  • getHash
  • setHash
  • getParams
  • getQuery
  • setParam
  • getParam
  • hasParam
  • removeParam

例:

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>');

這是我將Andy E的優秀解決方案變成一個完整的jQuery插件的嘗試:

;(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);

語法是:

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

兩全其美!


這裡發布的一些解決方案效率低下。 每次腳本需要訪問參數時重複正則表達式搜索是完全沒有必要的,將參數拆分成關聯數組樣式對象的單個函數就足夠了。 如果您不使用HTML 5 History API,則每頁加載時只需執行一次。 此處的其他建議也無法正確解碼URL。

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]);
})();

示例查詢字符串:

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

結果:

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

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

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

這也很容易改進,以處理數組樣式的查詢字符串。 here一個例子,但由於RFC 3986中沒有定義數組樣式的參數,所以我不會用源代碼污染這個答案。 對於那些對“污染”版本感興趣的人,請看下面的campbeln答案

另外,正如評論中指出的那樣;key=value對的合法分隔符。 它需要一個更複雜的正則表達式來處理;& ,我認為這是不必要的,因為它很少見; 使用,我會說兩者都會被使用的可能性更小。 如果你需要支持; 而不是& ,只需在正則表達式中交換它們。

如果您使用的是服務器端預處理語言,則可能需要使用其本機JSON函數來為您完成繁重的工作。 例如,在PHP中,您可以編寫:

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

更簡單!


關於該問題的最佳答案的問題是它是在#之後放置的不支持的參數,但有時也需要獲得該值。

我修改了答案,讓它解析一個帶有井號的完整查詢字符串:

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;
};

我們剛剛發布了一個旨在一勞永逸地解決這個問題的項目arg.js它傳統上是如此困難,但現在你可以這樣做:

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

或獲得全部:

var params = Arg.all();

如果你關心它們之間的區別?query=true#hash=true那麼你可以使用Arg.query()Arg.hash()方法。


我喜歡這個(取自jquery-howto.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;
}

對我很有用。


這是Andy E鏈接的“Handle array-style query strings”-version的擴展版本。修復了一個錯誤(?key=1&key[]=2&key[]=3; 1丟失並替換為[2,3]),進行了一些小的性能改進(重新解碼值,重新計算“[”位置等)並添加了許多改進(功能化,支持?key=1&key=2,支持;分隔符) 。我把這些變量簡單地留了下來,但添加了很多評論以使它們具有可讀性(哦,我v在本地函數中重複使用,抱歉,如果這令人困惑的話)。

它將處理以下查詢字符串...

?測試=您好與人= NEEK與人[] =傑夫 - 人[] =吉姆人[詳細] =約翰&TEST3和非緩存= 1398914891264

......把它變成一個看起來像......的物體

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

正如您在上面所看到的,此版本處理一些“格式錯誤”的數組,即 - person=neek&person[]=jeff&person[]=jim或者person=neek&person=jeff&person=jim因為密鑰是可識別且有效的(至少在dotNet的NameValueCollection.Add):

如果指定的鍵已存在於目標NameValueCollection實例中,則指定的值將以“value1,value2,value3”形式添加到現有的以逗號分隔的值列表中。

由於沒有規範,陪審團似乎有點出於重複的關鍵。在這種情況下,多個密鑰存儲為(假)數組。但請注意,我不會將基於逗號的值處理為數組。

代碼:

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;
};

這是我不久前創建的一個功能,我很滿意。它不區分大小寫 - 這很方便。此外,如果請求的QS不存在,它只返回一個空字符串。

我使用的是壓縮版本。我為新手類型發布了未壓縮的帖子,以便更好地解釋發生了什麼。

我確信這可以進行優化或以不同的方式完成更快的工作,但它始終能夠滿足我的需求。

請享用。

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);
}

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

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];
        }
    }
}​

這就是假設URL是這樣你可以使用這個函數的方法

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

var tech = GetQueryStringParams('stringtext');
var blog = GetQueryStringParams('stringword');




query-string