JavaScript: Получить параметры GET запроса
В GET запросе иногда передаются параметры. Иногда к этим GET параметрам нужно получить доступ из кода JavaScript. Как известно строку GET запроса мы можем получить из свойства объекта window.location оно предоставляется всеми браузерами. На его основе и построим нашу функцию.
Подумаем, что в результате хотелось бы иметь? Я думаю, что было бы удобно, если бы GET запрос представился нам объектом, содержащим свойства с именами, как у свойств GET запроса, и с соответствующими значениями.
Например, имеем такой запрос: xxxxx.xx/xxx.html?aaa=111&bbb=foo&ccc=bar
Хотелось бы иметь такой объект:
{ aaa : 111, bbb : "foo", ccc : "bar" }
Что бы использовать следующим образом:
var queryStr = parseQueryString(window.location.search), someVar1 = queryStr['aaa'], // 111 someVar2 = queryStr['bbb'], // "foo" someVar2 = queryStr['ccc']; // "bar"
Удобно, да? Хотите?- Забирайте:
var parseQueryString = function (strQuery) { var strSearch = strQuery.substr(1), strPattern = /([^=]+)=([^&]+)&?/ig, arrMatch = strPattern.exec(strSearch), objRes = {}; while (arrMatch != null) { objRes[arrMatch[1]] = arrMatch[2]; arrMatch = strPattern.exec(strSearch); } return objRes; };
Многие могут возразить, мол "фуу... регулярки - они тормозные..." - имеете право, можно использовать реализацию без регулярок:
var parseQueryString = function (strQuery) { var i, tmp = [], tmp2 = [], objRes = {}; if (strQuery != '') { tmp = (strQuery.substr(1)).split('&'); for (i = 0; i < tmp.length; i += 1) { tmp2 = tmp[i].split('='); if (tmp2[0]) { objRes[tmp2[0]] = tmp2[1]; } } } return objRes; };
Во втором примере сложность алгоритма больше, за счет дополнительных проверок if () { ... }. В первом случае они просто не нужны.
И кстати, функция с использованием регулярки не намного медленнее, а, скажем в Google Chrome она даже быстрее, да и в Opera скорость одинаковая. Уступает она по скорости лишь в Firefox и в ранних IE, но она более устойчива чем второй вариант.
Например возьмем ситуации, когда GET запрос имеет не корректный формат (1 строка это результат функции с регуляркой, 2 - результат функции без регулярки. Тестировалось в Google Chrome):
-
xxxxx.xx/xxxxx.php?aaa=111&bbb=&ccc=666
{aaa: "111", bbb: undefined, ccc: "666"} {aaa: "111", bbb: "", ccc: "666"}
-
xxxxx.xx/xxxxx.php?aaa=111&bbb=&ccc=
{aaa: "111", bbb: undefined, ccc: undefined} {aaa: "111", bbb: "", ccc: ""}
-
xxxxx.xx/xxxxx.php?aaa=111&bbb&ccc=
{aaa: "111", bbb: undefined, ccc: undefined} {aaa: "111", bbb: undefined, ccc: ""}
-
xxxxx.xx/xxxxx.php?aaa=111&bbb&ccc
{aaa: "111", bbb: undefined, ccc: undefined} {aaa: "111", bbb: undefined, ccc: undefined}
-
xxxxx.xx/xxxxx.php?aaa=111&bbb&
{aaa: "111", bbb: undefined} {aaa: "111", bbb: undefined}
-
xxxxx.xx/xxxxx.php?aaa=111&bbb=
{aaa: "111", bbb: undefined} {aaa: "111", bbb: ""}
-
xxxxx.xx/xxxxx.php?aaa=111&bbb
{aaa: "111", bbb: undefined} {aaa: "111", bbb: undefined}
В принципе с этим можно жить, но как видно функция с регуляркой отрабатывает более корректно. А если доводить до ума второй вариант функции - то её сложность возрастет и как следствие потеряется преимущество в скорости выполнения, так что выбирайте.
Информация копипастерам
Внимание! Копирование контента с сайта, возможно только с разрешения администратора. Т.е. Меня! Я скорее всего разрешу Вам это сделать, в обмен на живую ссылку, на статью оригинал.