Как получить значения строки запроса в JavaScript?

Есть ли способ плагинов для получения значений строки запроса через jQuery (или без)?

Если да, то как? Если нет, есть ли плагин, который может это сделать?

вопрос задан 23.05.2009
Kemal Emin
6673 репутация

73 ответов


  • 7120 рейтинг

    Обновление: сентябрь-2018

    Вы можете использовать URLSearchParams, который прост и имеет хорошую поддержку браузера .

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

    Orignal

    Для этого вам не нужен 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 » ниже.

    ответ дан Artem Barger, с репутацией 29939, 23.05.2009
  • 1638 рейтинг

    Некоторые из размещенных здесь решений неэффективны. Повторение поиска регулярного выражения каждый раз, когда сценарий должен получить доступ к параметру, совершенно не нужен, достаточно одной отдельной функции для разделения параметров в объект стиля ассоциативного массива. Если вы не работаете с API истории HTML 5, это необходимо только один раз на загрузку страницы. Другие предложения здесь также не позволяют правильно декодировать 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]);
    })(); 

    Пример querystring:

    ?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
     

    Это можно было бы легко улучшить, чтобы обрабатывать строки строк в стиле массива. Пример этого здесь , но поскольку параметры стиля массива не определены в RFC 3986, я не буду загрязнять этот ответ исходным кодом. Для тех, кто интересуется «загрязненной» версией, посмотрите нижеприведенный ответ Campbeln .

    Кроме того, как указано в комментариях, ; является юридическим ограничителем для key=value пар. Это потребует более сложного регулярного выражения для обработки ; или & , что, я думаю, не нужно, потому что редко используется ; и я бы сказал, что еще более маловероятно, что оба будут использоваться. Если вам нужно поддерживать ; вместо & , просто поменяйте их в регулярном выражении.


    Если вы используете язык предварительной обработки на стороне сервера, вы можете использовать его собственные функции JSON для выполнения тяжелой работы для вас. Например, в PHP вы можете написать:

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

    Намного проще!

    ответ дан Andy E, с репутацией 255228, 21.05.2010
  • 1203 рейтинг

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

    С URL-адресом, равным ?topic=123&name=query+string , возвращается следующее:

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

    Метод Google

    Разрывая код Google, я нашел способ, которым они пользуются: 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
    }
     

    Он запутан, но это понятно.

    Они начинают искать параметры по URL от ? а также от хеша # . Затем для каждого параметра они разбиваются на знак равенства b[f][p]("=") (который выглядит как indexOf , они используют положение символа для получения ключа /значения). Разделив их, проверьте, имеет ли значение параметр или нет, если он имеет значение 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"];
     

    Код теста Regex

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

    Тестирование в Firefox 4.0 x86 на Windows Server 2008 R2 /7 x64

    • Метод разделения : 144,780 ± 2,17%
    • Regex метод : 13,891 ± 0,85% | На 90% медленнее
    ответ дан BrunoLM, с репутацией 57382, 4.10.2010
  • 641 рейтинг

    Улучшенная версия ответа Артема Баргера :

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

    Дополнительную информацию об улучшении см. По адресу : http://james.padolsey.com/javascript/bujs-1-getparameterbyname/.

    ответ дан James, с репутацией 89389, 1.03.2011
  • 513 рейтинг

    URLSearchParams

    Firefox 44+, Opera 36+, Edge 17+, Safari 10.3+ и Chrome 49+ поддерживают API-интерфейс URLSearchParams :

    Для стабильных версий IE существует политическая полиграфия URLSearchParams .

    Он не стандартизирован 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);
     

    Вы можете получить params также используя свойство shorthand .searchParams на объекте URL, как это:

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

    Вы читаете /устанавливаете параметры через API get(KEY) , set(KEY, VALUE) , append(KEY, VALUE) . Вы также можете перебирать все значения for (let p of params) {} .

    Для проведения аудита и тестирования доступна эталонная реализация и примерная страница .

    ответ дан Paul Sweatte, с репутацией 18881, 28.08.2012
  • 395 рейтинг

    Еще одна рекомендация. Плагин Purl позволяет извлекать все части URL, включая якорь, хост и т. Д.

    Он может использоваться с 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'
     

    Однако с 11 ноября 2014 года Purl больше не поддерживается, и автор рекомендует вместо этого использовать 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'
     
    ответ дан AlfaTeK, с репутацией 3888, 15.03.2011
  • 221 рейтинг

    ТЛ; др

    Быстрое, полное решение , которое обрабатывает многозначные ключи и закодированные символы .

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

    Что это за код?
    «нуль-коалесценция» , оценка короткого замыкания
    ES6 Назначения деструктурирования , функции стрелок , строки шаблонов

    Пример:
     "?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"
     



    Подробнее ... о решении Vanilla JavaScript.

    Для доступа к различным частям URL используйте location.(search|hash)

    Самое простое (фиктивное) решение

     var queryDict = {};
    location.search.substr(1).split("&").forEach(function(item) {queryDict[item.split("=")[0]] = item.split("=")[1]})
     
    • Правильно обрабатывает пустые клавиши .
    • Переопределяет несколько ключей с найденным последним значением.
     "?a=1&b=0&c=3&d&e&a=5"
    > queryDict
    a: "5"
    b: "0"
    c: "3"
    d: undefined
    e: undefined
     

    Многозначные ключи

    Простая проверка ключа (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]]})
     
    • Теперь возвращает массивы .
    • Значения доступа на qd.key[index] или qd[key][index]
     > qd
    a: ["1", "5"]
    b: ["0"]
    c: ["3"]
    d: [undefined]
    e: [undefined]
     

    Кодированные символы?

    Используйте decodeURIComponent() для второго или обоих разделов.

     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"]
     



    Из комментариев

    * !!! Обратите внимание, что decodeURIComponent(undefined) возвращает строку "undefined" . Решение заключается в простом использовании && , что гарантирует, что decodeURIComponent() не вызывается по неопределенным значениям. (См. «Полное решение» вверху.)

     v = v && decodeURIComponent(v);
     


    Если строка запроса пуста ( location.search == "" ), результат несколько вводит в заблуждение qd == {"": undefined} . Перед началом функции синтаксического анализа рекомендуется проверить запрос:

     if (location.search) location.search.substr(1).split("&").forEach(...)
     
    ответ дан Qwerty, с репутацией 8263, 16.01.2014
  • 215 рейтинг

    У Roshambo на snipplr.com есть простой сценарий для достижения описанного в параметрах URL-адреса с помощью jQuery | Улучшено . С его сценарием вы также легко можете вытащить только нужные параметры.

    Вот суть:

     $.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 /query равна xyz.com/index.html?lang=de .

    Просто позвоните var langval = $.urlParam('lang'); , и у вас это есть.

    UZBEKJON имеет отличную запись в блоге по этому поводу, а также получить параметры и значения URL с помощью jQuery .

    ответ дан brandonjp, с репутацией 2465, 19.03.2010
  • 164 рейтинг

    Если вы используете 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;
        }
    
    })();​
     

    Из-за нового API истории HTML и, в частности, history.pushState() и history.replaceState() , URL-адрес может измениться, что приведет к аннулированию кеша параметров и их значений.

    Эта версия будет обновлять свой внутренний кеш параметров при каждом изменении истории.

    ответ дан alex, с репутацией 331547, 23.05.2009
  • 96 рейтинг

    Просто используйте два разделения :

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

    Я читал все предыдущие и более полные ответы. Но я думаю, что это самый простой и быстрый метод. Вы можете проверить этот тест jsPerf

    Чтобы решить проблему в комментарии Rup, добавьте условное разделение, изменив первую строку на две ниже. Но абсолютная точность означает, что он теперь медленнее, чем регулярное выражение (см. 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;
    }
     

    Поэтому, если вы знаете, что не столкнетесь с контр-записью Рупа, это победит. В противном случае, regexp.

    Или, если у вас есть контроль над querystring и вы можете гарантировать, что значение, которое вы пытаетесь получить, никогда не будет содержать URL-кодированных символов (если эти значения будут плохой идеей), вы можете использовать следующую немного упрощенную и читаемую версию 1-го варианта:

         function getQueryStringValueByName(name) {
            var queryStringFromStartOfValue = location.search.split(name + '=')[1];
             return queryStringFromStartOfValue !== undefined ? queryStringFromStartOfValue.split('&')[0] : null;
     
    ответ дан Martin Borthiry, с репутацией 3168, 3.09.2012
  • 94 рейтинг

    Вот мой удар по созданию превосходного решения 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');
     

    Лучшее обоих миров!

    ответ дан Ryan Phelan, с репутацией 261, 5.10.2010
  • 76 рейтинг

    Если вы делаете больше манипуляций с URL- адресами, чем просто разбираете запрос , вы можете найти URI.js полезным. Это библиотека для манипулирования URL-адресами - и поставляется со всеми звонками и свистами. (Извините за саморекламу здесь)

    чтобы преобразовать ваш запрос в карту:

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

    (URI.js также «исправляет» плохие запросы, например, от ?&foo&&bar=baz& до ?foo&bar=baz )

    ответ дан rodneyrehm, с репутацией 11708, 20.02.2012
  • 57 рейтинг

    Мне нравится решение Райана Фелана . Но я не вижу смысла расширять jQuery для этого? Нет функции jQuery.

    С другой стороны, мне нравится встроенная функция в Google Chrome: 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-библиотек. Подробнее об этой функции в моем блоге .

    ответ дан Anatoly Mironov, с репутацией 5326, 10.01.2012
  • 53 рейтинг

    Вот быстрый способ получить объект, похожий на массив 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;
    }
     

    Применение:

     var $_GET = get_query();
     

    Для строки запроса x=5&y&z=hello&x=6 это возвращает объект:

     {
      x: "6",
      y: undefined,
      z: "hello"
    }
     
    ответ дан Paulpro, с репутацией 109348, 30.08.2012
  • 52 рейтинг

    Проще простого кода 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');
     
    ответ дан Sagiv Ofek, с репутацией 13091, 20.02.2012
  • 45 рейтинг

    Все это отличные ответы, но мне нужно было что-то более надежное, и я подумал, что вам все может понравиться то, что я создал.

    Это простой библиотечный метод, который выполняет вскрытие и манипулирование параметрами 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>');
     
    ответ дан Bernesto, с репутацией 571, 13.09.2012
  • 43 рейтинг

    Из MDN :

     function loadPageVar (sVar) {
      return unescape(window.location.search.replace(new RegExp("^(?:.*[&\\?]" + escape(sVar).replace(/[\.\+\*]/g, "\\$&") + "(?:\\=([^&]*))?)?.*$", "i"), "$1"));
    }
    
    alert(loadPageVar("name"));
     
    ответ дан orip, с репутацией 45654, 11.02.2013
  • 39 рейтинг

    Я использую регулярные выражения, но не для этого.

    Мне кажется проще и эффективнее прочитать строку запроса один раз в моем приложении и построить объект из всех пар ключ /значение, например:

     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.param1 и search.param2 .

    ответ дан Mic, с репутацией 20207, 14.03.2011
  • 39 рейтинг

    Код гольфа:

     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
     
    ответ дан shanimal, с репутацией 71, 16.11.2010
  • 38 рейтинг

    Метод jQuery в Рошамбо не заботился о расшифровке URL

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

    Просто добавила эту возможность при добавлении в оператор return

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

    Теперь вы можете найти обновленную версию:

     $.urlParam = function(name){
    var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(window.location.href);
    if (!results) { return 0; }
    return decodeURIComponent(results[1].replace(/\+/g, " ")) || 0;
    }
     
    ответ дан Mohammad Arif, с репутацией 4361, 14.12.2010
  • 38 рейтинг
    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
    
    ответ дан Jet, с репутацией 913, 10.07.2010
  • 36 рейтинг

    Мне нравится этот (взято из 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;
    }
     

    Отлично работает для меня.

    ответ дан Tomamais, с репутацией 75, 26.07.2012
  • 35 рейтинг

    Вот мое редактирование на этот отличный ответ - с добавленной возможностью разбора строк запроса с ключами без значений.

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

    ВАЖНЫЙ! Параметр для этой функции в последней строке отличается. Это просто пример того, как можно передать произвольный URL-адрес. Вы можете использовать последнюю строку из ответа Бруно для анализа текущего URL-адреса.

    Так что же изменилось? С url http://sb.com/reg/step1?param= результаты будут такими же. Но с url http://sb.com/reg/step1?param решение Bruno возвращает объект без ключей, а мой возвращает объект с ключом param и undefined значением.

    ответ дан skaurus, с репутацией 755, 18.08.2011
  • 33 рейтинг

    Мне нужен был объект из строки запроса, и я ненавижу много кода. Он не может быть самым надежным во вселенной, но это всего лишь несколько строк кода.

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

    URL-адрес, подобный this.htm?hello=world&foo=bar будет создавать:

     {hello:'world', foo:'bar'}
     
    ответ дан tim, с репутацией 2283, 14.02.2013
  • 31 рейтинг

    Вот расширенная версия связанных строк Andy E «Обработка строк в стиле массива» - версия. Исправлена ​​ошибка ( ?key=1&key[]=2&key[]=3 ; 1 потеряна и заменена на [2,3] ), сделал несколько незначительных улучшений производительности (повторное декодирование значений, пересчет "[" позиция и т. Д.) И добавлено несколько улучшений (функционализация, поддержка ?key=1&key=2 , поддержка ; разделителей). Я оставил переменные досадно короткими, но добавил комментарии в изобилии, чтобы сделать их читаемыми (о, и я повторно использовал v в локальных функциях, извините, если это запутывает;).

    Он будет обрабатывать следующие запросы ...

    ? Тест = Hello & лицо = NEEK и человек [] = Джеф & человек [] = джим и человек [экстра] = джон & test3 & NoCache = 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 поскольку ключ идентифицируется и действителен (по крайней мере, в файле NameValueCollection.Add в dotNet ):

    Если указанный ключ уже существует в целевом экземпляре 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;
    };
     
    ответ дан Campbeln, с репутацией 1425, 1.05.2014
  • 31 рейтинг

    Это функция, которую я создал некоторое время назад, и я вполне доволен. Это не чувствительно к регистру - это удобно. Кроме того, если запрошенное 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);
    }
     
    ответ дан Clint, с репутацией 51, 28.01.2011
  • 27 рейтинг

    Мы только что выпустили arg.js , проект, нацеленный на решение этой проблемы раз и навсегда. Это традиционно было так сложно, но теперь вы можете сделать:

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

    или получить всю партию:

     var params = Arg.all();
     

    и если вам нужна разница между ?query=true и #hash=true вы можете использовать Arg.query() и Arg.hash() методов.

    ответ дан Mat Ryer, с репутацией 1525, 30.09.2013
  • 27 рейтинг

    Проблема с верхним ответом на этот вопрос заключается в том, что это не поддерживаемые параметры, размещенные после #, но иногда также необходимо получить это значение.

    Я изменил ответ, чтобы он проанализировал полную строку запроса с помощью символа hash:

     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;
    };
     
    ответ дан Ph0en1x, с репутацией 6710, 13.04.2013
  • 25 рейтинг
     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');
     
    ответ дан gewel, с репутацией 273, 6.02.2013
  • 20 рейтинг
     http://someurl.com?key=value&keynovalue&keyemptyvalue=&&keynovalue=nowhasvalue#somehash
     
    • Параллельная пара ключей /значений ( ?param=value )
    • Ключи без значения ( ?param : нет знака равенства или значения)
    • Ключи с пустым значением ( ?param= : знак равенства, но без значения справа от знака равенства)
    • Повторные клавиши ( ?param=1&param=2 )
    • Удаляет пустые ключи ( ?&& : нет ключа или значения)

    Код:

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

    Как позвонить:

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

    Вывод:

    •  key            ["value"]
      keyemptyvalue  [""]
      keynovalue     [undefined, "nowhasvalue"]
       
    ответ дан vol7ron, с репутацией 23684, 6.04.2012
  • 20 рейтинг

    Я разработал небольшую библиотеку, используя перечисленные здесь методы для создания простого в использовании решения для решения любых проблем; Это можно найти здесь:

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

    Применение

    Получение определенного параметра /ключа:

     query.get('param');
     

    Использование построителя для извлечения всего объекта:

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

    и еще тонны ... проверьте ссылку github для получения дополнительных примеров.

    Особенности

    1. Кэширование как по декодированию, так и по параметрам
    2. Поддерживает строки запроса хеша #hello?page=3
    3. Поддерживает передачу пользовательских запросов
    4. Поддерживает параметры массива /объекта user[]="jim"&user[]="bob"
    5. Поддержка пустого управления &&
    6. Поддерживает параметры объявления без значений name&hello="world"
    7. Поддерживает повторяющиеся параметры param=1&param=2
    8. Чистый, компактный и читаемый источник 4kb
    9. Поддержка AMD, Require, Node
    ответ дан Nijikokun, с репутацией 1156, 25.01.2013
  • 20 рейтинг

    Однострочный запрос для запроса:

     var value = location.search.match(new RegExp(key + "=(.*?)($|\&)", "i"))[1];
     
    ответ дан Anoop, с репутацией 18824, 15.11.2012
  • 19 рейтинг

    Если вы используете Browserify, вы можете использовать модуль url из Node.js :

     var url = require('url');
    
    url.parse('http://example.com/?bob=123', true).query;
    
    // returns { "bob": "123" }
     

    Дальнейшее чтение: URL Node.js v0.12.2 Руководство и документация

    ответ дан nkh, с репутацией 3928, 14.05.2013
  • 17 рейтинг

    Вот моя версия кода синтаксического анализа строки запроса на GitHub .

    Это «префикс» с помощью jquery. *, Но сама функция синтаксического анализа не использует jQuery. Это довольно быстро, но все еще доступно для нескольких простых оптимизаций производительности.

    Также он поддерживает кодировку списка и хеш-таблиц в URL-адресе, например:

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

    или

     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;
    
    }
     
    ответ дан Vadim, с репутацией 3927, 16.11.2010
  • 17 рейтинг

    Очень легкий метод jQuery:

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

    И, например, предупредить? Q

     alert(request.q)
     
    ответ дан Roi, с репутацией 1018, 29.03.2013
  • 12 рейтинг

    Вот что я использую:

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

    Возвращение 'override', а не '0' в последнем случае делает его совместимым с PHP. Работает в IE7.

    ответ дан Vladimir Kornea, с репутацией 1827, 30.05.2014
  • 11 рейтинг

    Я предпочел бы использовать split() вместо Regex для этой операции:

     function getUrlParams() {
        var result = {};
        var params = (window.location.search.split('?')[1] || '').split('&');
        for(var param in params) {
            if (params.hasOwnProperty(param)) {
                paramParts = params[param].split('=');
                result[paramParts[0]] = decodeURIComponent(paramParts[1] || "");
            }
        }
        return result;
    }
     
    ответ дан Eneko Alonso, с репутацией 11267, 3.05.2011
  • 10 рейтинг

    Для тех, кто хочет короткий метод (с ограничениями):

     location.search.split('myParameter=')[1]
     
    ответ дан George, с репутацией 4365, 14.04.2014
  • 10 рейтинг

    Получите все параметры запроса, включая значения флажка (массивы).

    Учитывая правильное и нормальное использование параметров GET, то, что я вижу, отсутствует в большинстве функций, это поддержка массивов и удаление хэш-данных.

    Поэтому я написал эту функцию:

     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
    }
     

    Использование сокращенных операторов и while-loop, производительность должна быть очень хорошей.

    Поддержка:

    1. Пустые значения ( ключ = /ключ )
    2. Значение ключа ( ключ = значение )
    3. Массивы ( ключ [] = значение )
    4. Хэш ( хэш-тег разделен )

    Заметки:

    Он не поддерживает массивы объектов (ключ [ключ] = значение)

    Если пробел равен +, он остается +.

    Добавьте .replace(/\+/g, " ") если вам нужно.

    Применение:

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

    Вернуть:

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

    Демо - версия:

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

    Информация

    Если вы что-то не понимаете или не можете читать функцию, просто спросите. Я рад объяснить, что я здесь сделал.

    Если вы считаете, что функция не читается и недоступна, я с удовольствием переписываю эту функцию для вас, но считаю, что сокращенные и побитовые операторы всегда быстрее стандартного синтаксиса (возможно, читайте о сокращенных и побитовых операторах в книге ECMA-262 или используйте ваша любимая поисковая система). Переписывание кода в стандартном читаемом синтаксисе означает потерю производительности.

    ответ дан cocco, с репутацией 11897, 25.01.2014
  • 9 рейтинг

    Это прекрасно работает

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

    взятый отсюда

    ответ дан IT ppl, с репутацией 2193, 24.05.2012
  • 8 рейтинг
     function getUrlVar(key){
        var result = new RegExp(key + "=([^&]*)", "i").exec(window.location.search); 
        return result && unescape(result[1]) || ""; 
    }
     

    https://gist.github.com/1771618

    ответ дан alkos333, с репутацией 406, 8.02.2012
  • 6 рейтинг

    Эта функция преобразует запрос в JSON-подобный объект, а также обрабатывает значения без значения и многозначные параметры:

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

    Мы выполняем проверку на undefined на parameter[1] потому что decodeURIComponent возвращает строку «undefined», если переменная равна undefined , и это неправильно.

    Применение:

     "use strict";
    var data = getQuerystringData();
    var parameterValue = getQuerystringData("parameterName");
     
    ответ дан Albireo, с репутацией 8148, 26.10.2012
  • 6 рейтинг

    Попробуй это:

     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(/(&|;|$)/))) : "";
    };
     

    Затем назовите его так:

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

    Вы также можете использовать это для файлов cookie :

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

    Это работает только для строк, которые имеют key=value[&|;|$] ... не будут работать с объектами /массивами.

    Если вы не хотите использовать String.prototype ... переместите его в функцию и передайте строку в качестве аргумента

    ответ дан does_not_exist, с репутацией , 5.01.2012
  • 6 рейтинг

    Я использовал этот код (JavaScript), чтобы получить то, что передается через URL-адрес:

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

    Затем, чтобы присвоить значение переменной, вам нужно указать только тот параметр, который вы хотите получить, т. Е. Если URL-адрес равен example.com/?I=1&p=2&f=3

    Вы можете сделать это, чтобы получить значения:

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

    то значения будут:

     getI = 1, getP = 2 and getF = 3
     
    ответ дан does_not_exist, с репутацией , 7.09.2013
  • 6 рейтинг

    Следующий код создаст объект, который имеет два метода:

    1. isKeyExist : проверьте, существует ли какой-либо конкретный параметр
    2. getValue : Получить значение определенного параметра.

     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;
           }
    };
     
    ответ дан Anoop, с репутацией 18824, 16.10.2011
  • 5 рейтинг

    Следующая функция возвращает объектную версию вашего запросаString. Вы можете просто написать obj.key1 и obj.key2 для доступа к значениям key1 и key2 в параметре.

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

    И для использования этой функции вы можете написать

     var obj= getQueryStringObject();
    alert(obj.key1);
     
    ответ дан Imdad, с репутацией 4700, 2.07.2012
  • 5 рейтинг

    Вот мой собственный подход к этому. Эта первая функция декодирует строку URL в объект пар имя /значение:

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

    И в качестве дополнительного бонуса, если вы измените некоторые из аргументов, вы можете использовать эту вторую функцию, чтобы вернуть массив аргументов в строку 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;
    };
     
    ответ дан BMitch, с репутацией 49299, 22.02.2012
  • 5 рейтинг

    Я сделал небольшую библиотеку URL для моих нужд здесь: https://github.com/Mikhus/jsurl

    Это более распространенный способ манипулирования URL-адресами в JavaScript. Между тем это действительно легкий (minified и gzipped <1 КБ) и имеет очень простой и чистый API. И не нужна никакая другая библиотека для работы.

    Что касается первоначального вопроса, это очень просто сделать:

     var u = new Url; // Current document URL
    // or
    var u = new Url('http://user:pass@example.com: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);
     
    ответ дан Mikhus, с репутацией 1029, 19.04.2013
  • 4 рейтинг

    Если вам нужны параметры стиля массива, URL.js поддерживает произвольно вложенные параметры стиля массива, а также строковые индексы (карты). Он также обрабатывает декодирование 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'
    }
     
    ответ дан Kevin Cox, с репутацией 1797, 1.04.2013
  • 4 рейтинг

    Есть много решений для получения значений запросов URI, я предпочитаю этот, потому что он короткий и отлично работает:

     function get(name){
       if(name=(new RegExp('[?&]'+encodeURIComponent(name)+'=([^&]*)')).exec(location.search))
          return decodeURIComponent(name[1]);
    }
     
    ответ дан BlueMark, с репутацией 610, 7.09.2013