read the GET variables in url JQuery

Question

Sorry for another "simple" question, but is there an easy way to read the GET variables from a URL. example. I have a url http://www.domain.com/page.php?var1=1 In my case I will only have 1 variable i.e. var1 or var2 (the variable can change but there will only every be one per url). All the tuts I have seen relate to arrays rather than "singletons" OK I know an array solution may be better but this is just a simple single get variable. Any suggestions? Thanks in advance

Answer 1

var split = location.search.replace('?', '').split('=')

split[0] is your var name, and split[1] is your var value. You actually don't really need jQuery for that piece of code ;)

As for twiz's comment, splitting multiple variables can be done like that:

var split = location.search.replace('?', '').split('&').map(function(val){
  return val.split('=');
});

You can access variable name by split[index][0] and value by split[index][1].

Of course you can use the second snippet instead of the first one for one variable too.

Answer 2

I use this in my default javascript file.

var get = [];
location.search.replace('?', '').split('&').forEach(function (val) {
    split = val.split("=", 2);
    get[split[0]] = split[1];
});

Now you can use them by name:

get["var1"]

Answer 3

You can use this function that returns the value of the specified var name from url if the var exists. Otherwise you will get an empty string.

function getUrlValue(varName) {
    var split = $(location).attr('href').split('?');
    var value = '';
    if (split.length == 2) {
        split = split[1].split('&');
        for (var i = 0; i < split.length; i+=1) {
            var keyValue = split[i].split('=');
            if (keyValue.length == 2 && keyValue[0] == varName) {
                value = keyValue[1];
                break;
            }
        }
    }
    return value;
}

Answer 4

With ES2019 to create an object:

let GET = Object.fromEntries( location.search
                                      .replace( '?', '' )
                                      .split( '&' )
                                      .map( i => i.split( '=' ) ) );

The Object.fromEntries method creates an object from an array.

For the URL http://www.example.com/page?var1=1&var2=2 the above code returns the object

{
  var1: '1',
  var2: '2'
}