Parse query string in JavaScript

Question

I need to parse the query string www mysite com default aspx dest aboutus aspx  How do I get the dest variable in JavaScript

User · Answer

Here s my version based loosely on Braceyard s version above but parsing into a  dictionary  and support for search args without      In use it in my JQuery   document  ready   function  The arguments are stored as key value pairs in argsParsed  which you might want to save somewhere      use strict    function parseQuery search         var args   search substring 1  split   amp          var argsParsed            var i  arg  kvp  key  value       for  i 0  i  lt  args length  i               arg   args i            if  -1     arg indexOf                      argsParsed decodeURIComponent arg  trim      true                    else                kvp   arg split                    key   decodeURIComponent kvp 0   trim                 value   decodeURIComponent kvp 1   trim                 argsParsed key    value                       return argsParsed     parseQuery document location search

User · Answer

Here is a fast and easy way of parsing query strings in JavaScript   function getQueryVariable variable        var query   window location search substring 1       var vars   query split   amp         for  var i   0  i  lt  vars length  i              var pair   vars i  split               if  decodeURIComponent pair 0      variable                return decodeURIComponent pair 1                        console log  Query variable  s not found   variable       Now make a request to page html x Hello   console log getQueryVariable  x

User · Answer

function parseQuery queryString        var query           var pairs    queryString 0            queryString substr 1    queryString  split   amp         for  var i   0  i  lt  pairs length  i              var pair   pairs i  split               query decodeURIComponent pair 0      decodeURIComponent pair 1                    return query      Turns query string like hello 1 amp another 2 into object  hello  1  another  2   From there  it s easy to extract the variable you need    That said  it does not deal with array cases such as  hello 1 amp hello 2 amp hello 3   To work with this  you must check whether a property of the object you make exists before adding to it  and turn the value of it into an array  pushing any additional bits

User · Answer

I wanted a simple function that took a URL as an input and returned a map of the query params  If I were to improve this function  I would support the standard for array data in the URL  and or nested variables    This should work back and for with the jQuery param  qparams   function   function getQueryParams url       var qparams               parts    url      split               qparts  qpart          i 0       if parts length  lt   1            return qparams       else          qparts   parts 1  split   amp             for i in qparts                qpart   qparts i  split                   qparams decodeURIComponent qpart 0                                  decodeURIComponent qpart 1                               return qparams

User · Answer

I wanted to pick up specific links within a DOM element on a page  send those users to a redirect page on a timer and then pass them onto the original clicked URL  This is how I did it using regular javascript incorporating one of the methods above   Page with links  Head    function replaceLinks        var content   document getElementById  mainContent                var nodes   content getElementsByTagName  a            for  var i   0  i  lt  document getElementsByTagName  a   length  i                                    href   nodes i  href                  if  href indexOf  thisurl com      -1                         nodes i  href  http   www thisurl com redirect aspx      url     nodes i                       nodes i  target   blank                                              Body   lt body onload  replaceLinks    gt    Redirect page Head     function getQueryVariable variable            var query   window location search substring 1           var vars   query split   amp             for  var i   0  i  lt  vars length  i                  var pair   vars i  split                   if  decodeURIComponent pair 0      variable                    return decodeURIComponent pair 1                                    console log  Query variable  s not found   variable             function delayer            window location   getQueryVariable  url           Body   lt body onload  setTimeout  delayer     1000   gt

User · Answer

Me too  http   jsfiddle net drzaus 8EE8k    Note  without fancy nested or duplicate checking   deparam    function d x params p i j    return function  qs           start bucket  can t cheat by setting it in scope declaration or it overwrites     params              remove preceding non-querystring  correct spaces  and split     qs   qs substring qs indexOf      1  replace x      split   amp            march and parse     for  i   qs length  i  gt  0             p   qs --i              allow equals in value         j   p indexOf                  what if no val          if j     -1  params d p     undefined          else params d p substring 0 j      d p substring j 1               return params      --  fn  deparam    decodeURIComponent      g     And tests   var tests       tests  simple params      ID 2 amp first 1 amp second b   tests  full url      http   blah com  third c amp fourth d amp fifth e   tests  just         animal bear amp fruit apple amp building Empire State Building amp spaces these are pluses   tests  with equals      foo bar amp baz quux amp equals with extra equals amp grault garply   tests  no value      foo bar amp baz  amp qux quux   tests  value omit      foo bar amp baz amp qux quux    var  output   document getElementById  output    function output msg        msg   Array prototype slice call arguments  0  join   n        if  output   output innerHTML      n    msg     n       else console log msg     var results          save results  so we can confirm we re not incorrectly referencing   each tests  function msg  test        var q   deparam test       results msg    q      output msg  test  JSON stringify q     param q        output  -------------------         output      confirming results non-overwrite          each results  function msg  result        output msg  JSON stringify result        output  -------------------          Results in   simple params ID 2 amp first 1 amp second b   second   b   first   1   ID   2   second b amp first 1 amp ID 2 ------------------- full url http   blah com  third c amp fourth d amp fifth e   fifth   e   fourth   d   third   c   fifth e amp fourth d amp third c ------------------- just    animal bear amp fruit apple amp building Empire State Building amp spaces these are pluses   spaces   these are pluses   building   Empire State Building   fruit   apple   animal   bear   spaces these 20are 20pluses amp building Empire 20State 20Building amp fruit apple amp animal bear ------------------- with equals foo bar amp baz quux amp equals with extra equals amp grault garply   grault   garply   equals   with extra equals   baz   quux   foo   bar   grault garply amp equals with 3Dextra 3Dequals amp baz quux amp foo bar ------------------- no value foo bar amp baz  amp qux quux   qux   quux   baz      foo   bar   qux quux amp baz  amp foo bar ------------------- value omit foo bar amp baz amp qux quux   qux   quux   foo   bar      lt -- it s there  i swear  qux quux amp baz  amp foo bar         lt --    see  jQuery found it -------------------

User · Answer

How about this   function getQueryVar varName          Grab and unescape the query string - appending an   amp   keeps the RegExp simple        for the sake of this example      var queryStr   unescape window location search      amp            Dynamic replacement RegExp     var regex   new RegExp       amp         varName           amp               Apply RegExp to the query string     var val   queryStr replace regex    1            If the string is the same  we didn t find a match - return false     return val    queryStr   false   val        then just call it with   alert  Var  dest        getQueryVar  dest       Cheers

User · Answer

Following on from my comment to the answer  bobby posted  here is the code I would use       function parseQuery str                    if typeof str     string     str length    0  return             var s   str split   amp             var s length   s length          var bit  query       first  second          for var i   0  i  lt  s length  i                              bit   s i  split                   first   decodeURIComponent bit 0                if first length    0  continue              second   decodeURIComponent bit 1                if typeof query first      undefined   query first    second              else if query first  instanceof Array  query first  push second               else query first     query first   second                          return query              This code takes in the querystring provided  as  str   and returns an object  The string is split on all occurances of  amp   resulting in an array  the array is then travsersed and each item in it is split by      This results in sub arrays wherein the 0th element is the parameter and the 1st element is the value  or undefined if no   sign   These are mapped to object properties  so for example the string  hello 1 amp another 2 amp something  is turned into     hello   1   another   2   something  undefined     In addition  this code notices repeating reoccurances such as  hello 1 amp hello 2  and converts the result into an array  eg     hello    1    2       You ll also notice it deals with cases in whih the   sign is not used  It also ignores if there is an equal sign straight after an  amp  symbol   A bit overkill for the original question  but a reusable solution if you ever need to work with querystrings in javascript

User · Answer

You can also use the excellent URI js library by Rodney Rehm  Here s how -  var qs   URI  www mysite com default aspx dest aboutus aspx   query true           dest    aboutus aspx        alert qs dest         aboutus aspx     And to parse the query string of current page -  var   GET   URI document URL  query true      ala PHP     alert   GET  dest           aboutus aspx

User · Answer

If you know that you will only have that one querystring variable you can simply do   var dest   location search replace

User · Answer

The following function will parse the search string with a regular expression  cache the result and return the value of the requested variable   window getSearch   function variable      var parsedSearch    parsedSearch   window parsedSearch     function         var match  re  ret      re                  amp     amp   gi      ret           while  match   re exec document location search           ret match 1     match 2             return window parsedSearch   ret            return parsedSearch variable        You can either call it once without any parameters and work with the window parsedSearch object  or call getSearch subsequently  I haven t fully tested this  the regular expression might still need some tweaking

[javascript] Parse query string in JavaScript

Examples related to javascript

Examples related to parsing

Examples related to query-string