CODEWITHSUNDEEP
javascript
jchand
jchand

Reputation: 827

What is location.search in javascript

I want to know what location.search.substring(1) actually does. I saw this code on some website. I tried to print using alert, but this did not give any result. Is it supposed to alert location href?

alert(location.search.substring(1))

Upvotes: 53

Views: 129013

Answers (7)

Rehan H
Rehan H

Reputation: 314

location.search returns a query string including the initial question mark. The substr method is to remove the initial question mark from the returned query string.

The reason why you're not getting any results in the alert() is because you're trying to read query string on a website which doesn't have any.

Here's how you test:

  1. Go to this URL
  2. Open up the console on your browser
  3. Paste the code snippet shared below and hit enter

var container = {};
location.search.split('&').toString().substr(1).split(",").forEach(item => {
    container[item.split("=")[0]] = decodeURIComponent(item.split("=")[1]) ?  item.split("=")[1]: "No query strings available" ;
});
console.log(container);

Old question but the answer might be helpful for new visitors on this page.

Upvotes: 7

hoogw
hoogw

Reputation: 5525

Now is year of 2018, this is how you do it in 2018.

Sample URL:

http://localhost:10/mapserver1/viewer/?config=viewer_simple1&url=https://maps2.dcgis.dc.gov/dcgis/rest/services/Zoning/MapServer&zoom=17&lat=38.917292&long=-77.036420

My working code to extract each query parameter:

        var ___zoom;
        var ___lat;
        var ___long;
        var ___basemap;

        var ___type;
        var ___url;
        var ___title;
        var ___opacity;



        if ( location.search.match(/zoom=([^&]*)/i) )
        {
             ___zoom = location.search.match(/zoom=([^&]*)/i)[1];
         }

        if ( location.search.match(/lat=([^&]*)/i) )
        {
           ___lat = location.search.match(/lat=([^&]*)/i)[1];
        }

        if (location.search.match(/long=([^&]*)/i))
        {
            ___long = location.search.match(/long=([^&]*)/i)[1];
        }

        if (location.search.match(/basemap=([^&]*)/i))
        {
            ___basemap = location.search.match(/basemap=([^&]*)/i)[1];
        }

        if (location.search.match(/type=([^&]*)/i))
        {
            ___type = location.search.match(/type=([^&]*)/i)[1];
        }

       if (location.search.match(/url=([^&]*)/i))
        {
            ___url = location.search.match(/url=([^&]*)/i)[1];
        }


        if (location.search.match(/title=([^&]*)/i))
        {
            ___title = location.search.match(/title=([^&]*)/i)[1];
        }

        if (location.search.match(/opacity=([^&]*)/i))
        {
            ___opacity = location.search.match(/opacity=([^&]*)/i)[1];
        }


        //console.log(location.search.match(/zoom=([^&]*)/i)[0]);   //    'zoom=17'
        //console.log(location.search.match(/zoom=([^&]*)/i)[1]);   //     '17'
        console.log(___zoom); 
        console.log(___lat); 
        console.log(___long); 
        console.log(___basemap); 

        console.log(___type); 
        console.log(___url); 
        console.log(___title); 
        console.log(___opacity);

Upvotes: 1

Gregor
Gregor

Reputation: 4434

The location.search property contains the query string of an URI (including the ?), if any.

Example:

http://www.example.org/index.php?param=arg
location.search is ?param=arg

So your code snips away the leading ? and returns param=arg.

Upvotes: 21

Tim S.
Tim S.

Reputation: 13843

The search property returns the query portion of a URL, including the question mark (?).

That means, that location.search.substring(1) should return the data without the question mark.

// http://www.example.com/index.html
console.log(location.search.substring(1)); // no query string, so displays nothing

// http://www.example.com/index.html?property=value
console.log(location.search.substring(1)); // should display "property=value"

The "query porpotion" is the query string:

http://www.example.com/?property=value&property2=value
                       |        query string         |

Upvotes: 17

JuHwon
JuHwon

Reputation: 2063

e.g. if you have the following url

http://www.example.org/index.htm?Browser=Netscape

then window.location.search will return ?Browser=Netscape as a string

Upvotes: 7

Nick H
Nick H

Reputation: 11535

It returns the query string, without the initial question mark. You'll only see a result if there's a query string on the page, e.g. http://www.example.com?parameter=value.

Upvotes: 1

sachleen
sachleen

Reputation: 31121

http://example.com/index.php?foo=bar

location.search
> ?foo=bar
location.search.substring(1)
> foo=bar

So that code will return the entire query parameters without the question mark.

Upvotes: 57

Related Questions