How to retrieve URL query parameter in JavaScript

Question

When I add a query parameter to a URL in the address bar, how do I retrieve it from JavaScript or jQuery? For example, when I enter index.php?id=70&edid=33, how do I retrieve the value 33?

Answer 1

In modern browsers, you may use a URL.searchParams ^[↗] object.

// Create a new URL object
let address = new URL(window.location);

// Get searchParameters property of the URL object
let queryParameters = address.searchParams;

// Retrieve specific query parameters
let id = queryParameters.get("id"); // 70
let edid = queryParameters.get("edid"); // 33

Browser support for URL.searchParams ^[↗] is as follows:

• Edge 17+
• Chrome 49+
• Safari 10.1+
• Firefox 44+

Answer 2

here is my answer for you. I think this is the best solution for this question. You can replace "index.php?id=70&edid=33" to "window.location.pathname" if the pathname contains the your deserve parameter.

var url="index.php?id=70&edid=33";
var qString=url.split("?")[1];
//console.log(qString);

var param_val=qString.split("&");

var params=[];
for(var i=0; i < param_val.length; i++){
  params.push(param_val[i].split("="));
}

var edit_id;
for(var j=0; j < params.length; j++){
    if(params[j][0]==="edid"){
      edit_id=params[j][1];
      break;
     }
}

console.log(edit_id);

Answer 3

You can get complete url from address bar via javascript and then manipulate it as follow

var address=document.location; var edid=address. substring(address.indexOf('edid')+5, address.indexOf(edid)+7);

This is not a perfect solution for this problem, but it will give you a idea of getting stuff to work.