Wie erhalte ich den Wert aus den GET-Parametern?

Bei den meisten Implementierungen fehlt die URL-Dekodierung der Namen und Werte.

Hier ist eine allgemeine Dienstprogrammfunktion, die auch die richtige URL-Dekodierung ausführt:

function getQueryParams(qs) {
    qs = qs.split('+').join(' ');

    var params = {},
        tokens,
        re = /[?&]?([^=]+)=([^&]*)/g;

    while (tokens = re.exec(qs)) {
        params[decodeURIComponent(tokens[1])] = decodeURIComponent(tokens[2]);
    }

    return params;
}

//var query = getQueryParams(document.location.search);
//alert(query.foo);

Quelle

function gup( name, url ) {
    if (!url) url = location.href;
    name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
    var regexS = "[\\?&]"+name+"=([^&#]*)";
    var regex = new RegExp( regexS );
    var results = regex.exec( url );
    return results == null ? null : results[1];
}
gup('q', 'hxxp://example.com/?q=abc')

Dies ist eine einfache Möglichkeit, nur einen Parameter zu überprüfen:

Beispiel URL:

    http://myserver/action?myParam=2

Beispiel Javascript:

    var myParam = location.search.split('myParam=')[1]

wenn "myParam" in der URL vorhanden ist ... Variable "myParam" wird "2" enthalten, andernfalls ist es undefiniert.

Vielleicht möchten Sie einen Standardwert, in diesem Fall:

    var myParam = location.search.split('myParam=')[1] ? location.search.split('myParam=')[1] : 'myDefaultValue';

Update: Das funktioniert besser:

    var url = "http://www.example.com/index.php?myParam=384&login=admin"; // or window.location.href for current url
    var captured = /myParam=([^&]+)/.exec(url)[1]; // Value is in [1] ('384' in our case)
    var result = captured ? captured : 'myDefaultValue';

Und es funktioniert auch dann richtig, wenn die URL mit Parametern gefüllt ist.

Browser-Hersteller haben eine native Methode implementiert, um dies über URL und URLSearchParams zu erreichen.

let url = new URL('http://www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5');
let searchParams = new URLSearchParams(url.search);
console.log(searchParams.get('c'));  // outputs "m2-m3-m4-m5"

Derzeit unterstützt in Firefox, Opera, Safari, Chrome und Edge. Für eine Liste der Browserunterstützung siehe hier .

https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParamshttps://developer.mozilla.org/en-US/docs/Web/API/URL/URL

https://url.spec.whatwg.org/

Eric Bidelman, Ingenieur bei Google, empfiehlt mit diesem Polyfill für nicht unterstützte Browser.

Sie können die Abfragezeichenfolge in location.search abrufen. Anschließend können Sie nach dem Fragezeichen alles aufteilen:

var params = {};

if (location.search) {
    var parts = location.search.substring(1).split('&');

    for (var i = 0; i < parts.length; i++) {
        var nv = parts[i].split('=');
        if (!nv[0]) continue;
        params[nv[0]] = nv[1] || true;
    }
}

// Now you can get the parameters you want like so:
var abc = params.abc;

Ich habe das vor langer Zeit gefunden, sehr einfach:

function getUrlVars() {
    var vars = {};
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi,    
    function(m,key,value) {
      vars[key] = value;
    });
    return vars;
  }

Dann nennen Sie es so:

var fType = getUrlVars()["type"];

Ich habe eine einfachere und elegantere Lösung geschrieben.

var arr = document.URL.match(/room=([0-9]+)/)
var room = arr[1];

Hier ist eine rekursive Lösung, die keinen Regex hat und eine minimale Mutation aufweist (nur das Params-Objekt ist mutiert, was meiner Meinung nach in JS unvermeidbar ist).

Es ist fantastisch, weil es:

• Ist rekursiv
• Behandelt mehrere Parameter mit demselben Namen
• Behandelt fehlerhafte Parameterzeichenfolgen (fehlende Werte usw.)
• Bricht nicht ab, wenn '=' im Wert ist
• Führt eine URL-Dekodierung durch
• Und zu guter Letzt, es ist großartig, weil es ... argh !!!

Code:

var get_params = function(search_string) {

  var parse = function(params, pairs) {
    var pair = pairs[0];
    var parts = pair.split('=');
    var key = decodeURIComponent(parts[0]);
    var value = decodeURIComponent(parts.slice(1).join('='));

    // Handle multiple parameters of the same name
    if (typeof params[key] === "undefined") {
      params[key] = value;
    } else {
      params[key] = [].concat(params[key], value);
    }

    return pairs.length == 1 ? params : parse(params, pairs.slice(1))
  }

  // Get rid of leading ?
  return search_string.length == 0 ? {} : parse({}, search_string.substr(1).split('&'));
}

var params = get_params(location.search);

// Finally, to get the param you want
params['c'];

Sieh dir das an

function getURLParameters(paramName)
{
    var sURL = window.document.URL.toString();
    if (sURL.indexOf("?") > 0)
    {
        var arrParams = sURL.split("?");
        var arrURLParams = arrParams[1].split("&");
        var arrParamNames = new Array(arrURLParams.length);
        var arrParamValues = new Array(arrURLParams.length);

        var i = 0;
        for (i = 0; i<arrURLParams.length; i++)
        {
            var sParam =  arrURLParams[i].split("=");
            arrParamNames[i] = sParam[0];
            if (sParam[1] != "")
                arrParamValues[i] = unescape(sParam[1]);
            else
                arrParamValues[i] = "No Value";
        }

        for (i=0; i<arrURLParams.length; i++)
        {
            if (arrParamNames[i] == paramName)
            {
                //alert("Parameter:" + arrParamValues[i]);
                return arrParamValues[i];
            }
        }
        return "No Parameters Found";
    }
}

Ein super einfacher Weg mit URLSearchParams .

function getParam(param){
  return new URLSearchParams(window.location.search).get(param);
}

Es wird derzeit in Chrome, Firefox, Safari, Edge und anderen unterstützt.

ECMAScript 6-Lösung:

var params = window.location.search
  .substring(1)
  .split("&")
  .map(v => v.split("="))
  .reduce((map, [key, value]) => map.set(key, decodeURIComponent(value)), new Map())

Ich habe eine Funktion erstellt, die dies tut:

var getUrlParams = function (url) {
  var params = {};
  (url + '?').split('?')[1].split('&').forEach(function (pair) {
    pair = (pair + '=').split('=').map(decodeURIComponent);
    if (pair[0].length) {
      params[pair[0]] = pair[1];
    }
  });
  return params;
};

Update 26.05.2017, hier ist eine ES7-Implementierung (läuft mit der voreingestellten Babel-Stufe 0, 1, 2 oder 3):

const getUrlParams = url => `${url}?`.split('?')[1]
  .split('&').reduce((params, pair) =>
    ((key, val) => key ? {...params, [key]: val} : params)
    (...`${pair}=`.split('=').map(decodeURIComponent)), {});

Einige Tests:

console.log(getUrlParams('https://google.com/foo?a=1&b=2&c')); // Will log {a: '1', b: '2', c: ''}
console.log(getUrlParams('/foo?a=1&b=2&c')); // Will log {a: '1', b: '2', c: ''}
console.log(getUrlParams('?a=1&b=2&c')); // Will log {a: '1', b: '2', c: ''}
console.log(getUrlParams('https://google.com/')); // Will log {}
console.log(getUrlParams('a=1&b=2&c')); // Will log {}

Update 26.03.2014, hier ist eine TypeScript-Implementierung:

const getUrlParams = (search: string) => `${search}?`
  .split('?')[1]
  .split('&')
  .reduce(
    (params: object, pair: string) => {
      const [key, value] = `${pair}=`
        .split('=')
        .map(decodeURIComponent)

      return key.length > 0 ? { ...params, [key]: value } : params
    },
    {}
  )

Update 2/13/2019, hier ist eine aktualisierte TypeScript-Implementierung, die mit TypeScript 3 funktioniert.

interface IParams { [key: string]: string }

const paramReducer = (params: IParams, pair: string): IParams => {
  const [key, value] = `${pair}=`.split('=').map(decodeURIComponent)

  return key.length > 0 ? { ...params, [key]: value } : params
}

const getUrlParams = (search: string): IParams =>
  `${search}?`.split('?')[1].split('&').reduce<IParams>(paramReducer, {})

Ich verwende die Bibliothek " parseUri ". Sie können genau das tun, wonach Sie fragen:

var uri = 'www.test.com/t.html&a=1&b=3&c=m2-m3-m4-m5';
var c = uri.queryKey['c'];
// c = 'm2-m3-m4-m5'

Ich benutze

function getVal(str) {
    var v = window.location.search.match(new RegExp('(?:[\?\&]'+str+'=)([^&]+)'));
    return v ? v[1] : null;
}

Hier ist meine Lösung. Wie von Andy E empfohlen, während Sie diese Frage beantworteten, ist es nicht gut für die Leistung Ihres Skripts, wenn Sie wiederholt verschiedene Regex-Strings erstellen, Schleifen ausführen usw., um nur einen einzigen Wert zu erhalten. Ich habe also ein einfacheres Skript entwickelt, das alle GET-Parameter in einem einzigen Objekt zurückgibt. Sie sollten es nur einmal aufrufen, das Ergebnis einer Variablen zuweisen und dann zu einem beliebigen Zeitpunkt in der Zukunft mithilfe der entsprechenden Taste einen beliebigen Wert aus dieser Variablen ermitteln. Beachten Sie, dass es sich auch um die URI-Dekodierung kümmert (d. H. Dinge wie% 20) und + durch ein Leerzeichen ersetzt:

 function getUrlQueryParams(url) {
  var queryString = url.split("?")[1];
  var keyValuePairs = queryString.split("&");
  var keyValue = [];
  var queryParams = {};
  keyValuePairs.forEach(function(pair) {
    keyValue = pair.split("=");
    queryParams[keyValue[0]] = decodeURIComponent(keyValue[1]).replace(/\+/g, " ");
});
  return queryParams;
}

Hier sind einige Tests des Skripts, die Sie sehen können:

// Query parameters with strings only, no special characters.
var currentParams = getUrlQueryParams("example.com/foo?number=zero");
alert(currentParams["number"]); // Gives "zero".

// For the URL you stated above...
var someParams = getUrlQueryParams("www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5 ");
alert(someParams["c"]); // Gives "m2-m3-m4-m5".

// For a query params with URI encoding...
var someParams = getUrlQueryParams("www.example.com/t.html?phrase=a%20long%20shot&location=Silicon+Valley%2C+USA");
alert(someParams["phrase"]); // Gives "a long shot".
alert(someParams["location"]); // Gives "Silicon Valley, USA".

Für Single Parameter Value wie diese index.html? Msg = 1 folgenden Code verwenden,

$(window).load(function(){
    queryString();
});

function queryString()
{
    var queryString = window.location.search.substring(1);
    var varArray = queryString.split("="); //eg. index.html?msg=1

    var param1 = varArray[0];
    var param2 = varArray[1];

}

Für All Parameter Value verwenden Sie folgenden Code,

$(window).load(function(){
    queryString();
});

function queryString()
{
    var queryString = window.location.search;
    var varArray = queryString.split("&");
    for (var i=0;i<varArray.length;i++) {
      var param = varArray[i].split("=");
        //parameter-value pair
    }
} 

diese Frage hat zu viele Antworten, also füge ich noch eine hinzu.

/**
 * parses and returns URI query parameters 
 * 
 * @param {string} param parm
 * @param {bool?} asArray if true, returns an array instead of a scalar 
 * @returns {Object|Array} 
 */
function getURIParameter(param, asArray) {
    return document.location.search.substring(1).split('&').reduce(function(p,c) {
        var parts = c.split('=', 2).map(function(param) { return decodeURIComponent(param); });
        if(parts.length == 0 || parts[0] != param) return (p instanceof Array) && !asArray ? null : p;
        return asArray ? p.concat(parts.concat(true)[1]) : parts.concat(true)[1];
    }, []);
}

verwendungszweck:

getURIParameter("id")  // returns the last id or null if not present
getURIParameter("id", true) // returns an array of all ids

dies geschieht mit leeren Parametern (diese Schlüssel sind ohne "=value" vorhanden), die Anzeige einer skalaren und Array-basierten API zum Abrufen von Werten sowie die korrekte Dekodierung von URI-Komponenten.

Hier poste ich ein Beispiel. Aber es ist in jQuery. Hoffe, es wird anderen helfen:

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.url.js"></script>

<!-- URL:  www.example.com/correct/?message=done&year=1990-->

<script type="text/javascript">
$(function(){
    $.url.attr('protocol')  // --> Protocol: "http"
    $.url.attr('path')          // --> Host: "www.example.com"
    $.url.attr('query')         // --> path: "/correct/"
    $.url.attr('message')   // --> query: "done"
    $.url.attr('year')      // --> query: "1990"
});
</script>

Oder wenn Sie das URI-Analyserad nicht neu erfinden möchten, verwenden Sie URI.js

So erhalten Sie den Wert eines Parameters mit dem Namen foo:

new URI((''+document.location)).search(true).foo

Was das macht, ist 

1. Konvertiere document.location in einen String (es ist ein Objekt) 
2. Führen Sie diese Zeichenfolge dem URI-Klassen-Construtor von URI.js zu
3. Rufen Sie die Funktion search () auf, um den Suchabschnitt (abfrage) der URL zu erhalten
   (Übergeben von true sagt ihm, ein Objekt auszugeben)
4. Rufen Sie die Eigenschaft foo für das resultierende Objekt auf, um den Wert abzurufen

Hier ist eine Geige dafür .... http://jsfiddle.net/m6tett01/12/

Einfacher Weg

function getParams(url){
        var regex = /[?&]([^=#]+)=([^&#]*)/g,
            params = {},
            match;
        while(match = regex.exec(url)) {
            params[match[1]] = match[2];
        }
        return params;
    }

dann nennen Sie es getParams (URL)

// Read a page's GET URL variables and return them as an associative array.
function getUrlVars()
{
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for(var i = 0; i < hashes.length; i++)
    {
        hash = hashes[i].split('=');
        vars.Push(hash[0]);
        vars[hash[0]] = hash[1];
    }
    return vars;
}

// Usage for URL: http://my.site.com/location?locationId=53cc272c0364aefcb78756cd&shared=false
var id = getUrlVars()["locationId"];

Von hier: http://jquery-howto.blogspot.ru/2009/09/get-url-parameters-values-with-jquery.html

// http:localhost:8080/path?param_1=a&param_2=b
var getParamsMap = function () {
    var params = window.location.search.split("&");
    var paramsMap = {};
    params.forEach(function (p) {
        var v = p.split("=");
        paramsMap[v[0]]=decodeURIComponent(v[1]);
    });
    return paramsMap;
};

// -----------------------

console.log(getParamsMap()["param_1"]);  // should log "a"     

Noch ein Vorschlag. 

Es gibt bereits einige gute Antworten, aber ich fand sie unnötig komplex und schwer zu verstehen. Dies ist kurz und einfach und gibt ein einfaches assoziatives Array mit Schlüsselnamen zurück, die den Token-Namen in der URL entsprechen. 

Ich habe eine Version mit Kommentaren für diejenigen hinzugefügt, die etwas lernen wollen.

Beachten Sie, dass dies auf jQuery ($ .each) für die Schleife angewiesen ist, die ich anstelle von forEach empfehle. Ich finde es einfacher, die Cross-Browser-Kompatibilität mit jQuery durchgängig zu gewährleisten, anstatt einzelne Fixes einzufügen, um die neuen Funktionen zu unterstützen, die in älteren Browsern nicht unterstützt werden.

Edit: Nachdem ich das geschrieben habe, fiel mir Eric Elliotts Antwort auf, die fast gleich ist, obwohl sie für jeden verwendet wird, obwohl ich generell dagegen bin (aus den oben genannten Gründen).

function getTokens(){
    var tokens = [];
    var query = location.search;
    query = query.slice(1);
    query = query.split('&');
    $.each(query, function(i,value){    
        var token = value.split('=');   
        var key = decodeURIComponent(token[0]);     
        var data = decodeURIComponent(token[1]);
        tokens[key] = data;
    });
    return tokens;
}

Kommentierte Version: 

function getTokens(){
    var tokens = [];            // new array to hold result
    var query = location.search; // everything from the '?' onward 
    query = query.slice(1);     // remove the first character, which will be the '?' 
    query = query.split('&');   // split via each '&', leaving us an array of something=something strings

    // iterate through each something=something string
    $.each(query, function(i,value){    

        // split the something=something string via '=', creating an array containing the token name and data
        var token = value.split('=');   

        // assign the first array element (the token name) to the 'key' variable
        var key = decodeURIComponent(token[0]);     

        // assign the second array element (the token data) to the 'data' variable
        var data = decodeURIComponent(token[1]);

        tokens[key] = data;     // add an associative key/data pair to our result array, with key names being the URI token names
    });

    return tokens;  // return the array
}

Für die folgenden Beispiele gehen wir von dieser Adresse aus:

http://www.example.com/page.htm?id=4&name=murray

Sie können die URL-Token Ihrer eigenen Variablen zuweisen:

var tokens = getTokens();

Verweisen Sie dann wie folgt auf jedes URL-Token:

document.write( tokens['id'] );

Dies würde "4" drucken.

Sie können auch einfach auf einen Token-Namen direkt von der Funktion verweisen:

document.write( getTokens()['name'] );

... was "murray" drucken würde.

Hier ist der angleJs Quellcode zum Analysieren von URL-Abfrageparametern in ein Objekt:

function tryDecodeURIComponent(value) {
  try {
    return decodeURIComponent(value);
  } catch (e) {
    // Ignore any invalid uri component
  }
}

function isDefined(value) {return typeof value !== 'undefined';}

function parseKeyValue(keyValue) {
  keyValue = keyValue.replace(/^\?/, '');
  var obj = {}, key_value, key;
  var iter = (keyValue || "").split('&');
  for (var i=0; i<iter.length; i++) {
    var kValue = iter[i];
    if (kValue) {
      key_value = kValue.replace(/\+/g,'%20').split('=');
      key = tryDecodeURIComponent(key_value[0]);
      if (isDefined(key)) {
        var val = isDefined(key_value[1]) ? tryDecodeURIComponent(key_value[1]) : true;
        if (!hasOwnProperty.call(obj, key)) {
          obj[key] = val;
        } else if (isArray(obj[key])) {
          obj[key].Push(val);
        } else {
          obj[key] = [obj[key],val];
        }
      }
    }
  };
  return obj;
}

alert(JSON.stringify(parseKeyValue('?a=1&b=3&c=m2-m3-m4-m5')));

Sie können diese Funktion zu window.location hinzufügen:

window.location.query = function query(arg){
  q = parseKeyValue(this.search);
  if (!isDefined(arg)) {
    return q;
  }      
  if (q.hasOwnProperty(arg)) {
    return q[arg];
  } else {
    return "";
  }
}

// assuming you have this url :
// http://www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5

console.log(window.location.query())

// Object {a: "1", b: "3", c: "m2-m3-m4-m5"}

console.log(window.location.query('c'))

// "m2-m3-m4-m5"

Ich musste eine URL-GET-Variable lesen und eine Aktion basierend auf dem URL-Parameter ausführen. Ich habe nach einer Lösung gesucht und bin auf dieses kleine Stück Code gestoßen. Es liest im Wesentlichen die aktuelle Seiten-URL, führt einige reguläre Ausdrücke für die URL aus und speichert die URL-Parameter in einem assoziativen Array, auf das wir leicht zugreifen können.

Also als Beispiel, wenn wir die folgende URL mit dem Javascript unten hätten.

http://TestServer/Pages/NewsArchive.aspx?year=2013&Month=July

Um die Parameter id und page zu erhalten, müssen Sie Folgendes aufrufen:

Der Code wird sein:

<script type="text/javascript">
var first = getUrlVars()["year"];
var second = getUrlVars()["Month"];

alert(first);
alert(second);
function getUrlVars() {
var vars = {};
var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
vars[key] = value;
});
return vars;
}
</script>

window.location.href.split("?")

ignorieren Sie dann den ersten Index

Array.prototype.slice.call(window.location.href.split("?"), 1) 

gibt ein Array Ihrer URL-Parameter zurück

var paramArray = Array.prototype.slice.call(window.location.href.split(/[?=]+/), 1);
var paramObject = paramArray.reduce(function(x, y, i, a){ (i%2==0) ?  (x[y] = a[i+1]) : void 0; return x; }, {});

Ein wenig ausführlicher/hacky, aber auch funktional, enthält paramObject alle Parameter, die als js-Objekt zugeordnet sind

Wir können die Parameter der Parameter c auf eine einfachere Weise abrufen, ohne alle Parameter in einer Schleife zu durchlaufen.

1. Um den Parameterwert zu erhalten:

var url = "www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5";

url.match(**/(c=)[0-9A-Za-z-]+/ig**)[0].replace('c=',"")

(oder)

url.match(**/(c=)[0-z-]+/ig**)[0].replace('c=',"")

gibt als String zurück

"m2-m3-m4-m5"

2. Den Parameterwert ersetzen:

var url = "www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5";

url.replace(**/(c=)[0-9A-Za-z-]+/ig, "c=m2345"**)

function getParamValue(param) {
    var urlParamString = location.search.split(param + "=");
    if (urlParamString.length <= 1) return "";
    else {
        var tmp = urlParamString[1].split("&");
        return tmp[0];
    }
}

Dies sollte für Ihren Fall funktionieren, egal ob der Parameter zuletzt ist oder nicht.

Folgendes mache ich:

var uriParams = getSearchParameters();
alert(uriParams.c);


// background functions:

// Get object/associative array of URL parameters
function getSearchParameters () {
  var prmstr = window.location.search.substr(1);
  return prmstr !== null && prmstr !== "" ? transformToAssocArray(prmstr) : {};
}

// convert parameters from url-style string to associative array
function transformToAssocArray (prmstr) {
  var params = {},
      prmarr = prmstr.split("&");

  for (var i = 0; i < prmarr.length; i++) {
    var tmparr = prmarr[i].split("=");
    params[tmparr[0]] = tmparr[1];
  }
  return params;
}

Der kürzeste Weg:

new URL(location.href).searchParams.get("my_key");

Dieser Gist von Eldon McGuinness ist bei weitem die vollständigste Implementierung eines JavaScript-Abfrage-String-Parsers, den ich bisher gesehen habe.

Leider ist es als jQuery-Plugin geschrieben.

Ich habe es an Vanilla JS geschrieben und ein paar Verbesserungen vorgenommen:

function parseQuery(str) {
  var qso = {};
  var qs = (str || document.location.search);
  // Check for an empty querystring
  if (qs == "") {
    return qso;
  }
  // Normalize the querystring
  qs = qs.replace(/(^\?)/, '').replace(/;/g, '&');
  while (qs.indexOf("&&") != -1) {
    qs = qs.replace(/&&/g, '&');
  }
  qs = qs.replace(/([\&]+$)/, '');
  // Break the querystring into parts
  qs = qs.split("&");
  // Build the querystring object
  for (var i = 0; i < qs.length; i++) {
    var qi = qs[i].split("=");
    qi = qi.map(function(n) {
      return decodeURIComponent(n)
    });
    if (typeof qi[1] === "undefined") {
      qi[1] = null;
    }
    if (typeof qso[qi[0]] !== "undefined") {

      // If a key already exists then make this an object
      if (typeof (qso[qi[0]]) == "string") {
        var temp = qso[qi[0]];
        if (qi[1] == "") {
          qi[1] = null;
        }
        qso[qi[0]] = [];
        qso[qi[0]].Push(temp);
        qso[qi[0]].Push(qi[1]);

      } else if (typeof (qso[qi[0]]) == "object") {
        if (qi[1] == "") {
          qi[1] = null;
        }
        qso[qi[0]].Push(qi[1]);
      }
    } else {
      // If no key exists just set it as a string
      if (qi[1] == "") {
        qi[1] = null;
      }
      qso[qi[0]] = qi[1];
    }
  }
  return qso;
}

// DEMO
console.log(parseQuery("?foo=bar&foo=boo&roo=bar;bee=bop;=ghost;=ghost2;&;checkbox%5B%5D=b1;checkbox%5B%5D=b2;dd=;http=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab&http=http%3A%2F%2Fw3schools2.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab"));

Siehe auch this Fiddle .

Verwenden Sie Dojo. Keine andere Lösung hier ist so kurz oder so gut getestet:

require(["dojo/io-query"], function(ioQuery){
    var uri = "www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5 ";
    var query = uri.substring(uri.indexOf("?") + 1, uri.length);
    var queryObject = ioQuery.queryToObject(query);
    console.log(queryObject.c); //prints m2-m3-m4-m5
});

PHP parse_str Nachahmer .. :)

// Handles also array params well
function parseQueryString(query) {
    var pars = (query != null ? query : "").replace(/&+/g, "&").split('&'),
        par, key, val, re = /^([\w]+)\[(.*)\]/i, ra, ks, ki, i = 0,
        params = {};

    while ((par = pars.shift()) && (par = par.split('=', 2))) {
        key = decodeURIComponent(par[0]);
        // prevent param value going to be "undefined" as string
        val = decodeURIComponent(par[1] || "").replace(/\+/g, " ");
        // check array params
        if (ra = re.exec(key)) {
            ks = ra[1];
            // init array param
            if (!(ks in params)) {
                params[ks] = {};
            }
            // set int key
            ki = (ra[2] != "") ? ra[2] : i++;
            // set array param
            params[ks][ki] = val;
            // go on..
            continue;
        }
        // set param
        params[key] = val;
    }

    return params;
}

var query = 'foo=1&bar=The+bar!%20&arr[]=a0&arr[]=a1&arr[s]=as&isset&arr[]=last';
var params = parseQueryString(query);
console.log(params)
console.log(params.foo)        // 1
console.log(params.bar)        // The bar!
console.log(params.arr[0])     // a0
console.log(params.arr[1])     // a1
console.log(params.arr.s)      // as
console.log(params.arr.none)   // undefined
console.log("isset" in params) // true like: isset($_GET['isset'])



/*
// in php
parse_str('foo=1&bar=The+bar!%20&arr[]=a0&arr[]=a1&arr[s]=as&isset&arr[]=last', $query);
print_r($query);

Array
(
    [foo] => 1
    [bar] => The bar!
    [arr] => Array
        (
            [0] => a0
            [1] => a1
            [s] => as
            [2] => last
        )

    [isset] =>
)*/

Am einfachsten geht das mit der Methode replace():

Aus der urlStr Zeichenfolge:

_paramVal = urlStr.replace(/.*param_name=([^&]*).*|(.*)/, '$1');
_

oder aus der aktuellen URL:

_paramVal = document.URL.replace(/.*param_name=([^&]*).*|(.*)/, '$1');
_

Erklärung:

• document.URL - Die Schnittstelle gibt den Speicherort des Dokuments (Seiten-URL) als Zeichenfolge zurück.
• replace() - Methode gibt eine neue Zeichenfolge mit einigen oder allen Übereinstimmungen eines Musters zurück, das durch eine Ersetzung ersetzt wurde .
• /.*param_name=([^&]*).*/ - das regulärer Ausdruck Muster zwischen Schrägstrichen, was bedeutet:
  • _.*_ - ein oder mehrere beliebige Zeichen,
  • _param_name=_ - Name des Parameters, der gesucht wird,
  • _()_ - Gruppe in regulärem Ausdruck,
  • _[^&]*_ - ein oder mehrere beliebige Zeichen außer _&_,
  • _|_ - Wechsel,
  • _$1_ - Verweis auf die erste Gruppe im regulären Ausdruck.

_var urlStr = 'www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5';
var c = urlStr.replace(/.*c=([^&]*).*|(.*)/, '$1');
var notExisted = urlStr.replace(/.*not_existed=([^&]*).*|(.*)/, '$1');
console.log(`c === '${c}'`);
console.log(`notExisted === '${notExisted}'`);_

Sie können ein Eingabefeld hinzufügen und den Benutzer dann bitten, den Wert in das Feld zu kopieren. So einfach ist das:

<h1>Hey User! Can you please copy the value out of the location bar where it says like, &m=2? Thanks! And then, if you could...paste it in the box below and click the Done button?</h1>
<input type='text' id='the-url-value' />
<input type='button' value='This is the Done button. Click here after you do all that other stuff I wrote.' />

<script>
//...read the value on click

Ok, im Ernst ... ich habe diesen Code gefunden und es scheint gut zu funktionieren:

http://www.developerdrive.com/2013/08/turning-the-querystring-into-a-json-object-using-javascript/

function queryToJSON() {
    var pairs = location.search.slice(1).split('&');

    var result = {};
    pairs.forEach(function(pair) {
        pair = pair.split('=');
        result[pair[0]] = decodeURIComponent(pair[1] || '');
    });

    return JSON.parse(JSON.stringify(result));
}

var query = queryToJSON();

Ich schreibe so gerne wie möglich eine Kurzschrift:

URL: example.com/mortgage_calc.htm?pmts=120&intr=6.8&prin=10000

Vanilla Javascript:

for ( var vObj = {}, i=0, vArr = window.location.search.substring(1).split('&');
        i < vArr.length; v = vArr[i++].split('='), vObj[v[0]] = v[1] ){}
// vObj = {pmts: "120", intr: "6.8", prin: "10000"}

Elegante, funktionale Lösung

Erstellen wir ein Objekt, das URL-Parameternamen als Schlüssel enthält, dann können wir den Parameter einfach anhand seines Namens extrahieren:

  // URL: https://example.com/?test=true&orderId=9381  

  // Build an object containing key-value pairs
  const urlParams = window.location.search
    .split('?')[1]
    .split('&')
    .map(keyValue => keyValue.split('='))
    .reduce((params, [key, value]) => {
      params[key] = value;
      return params;
    }, {});

  // Return URL parameter called "orderId"
  return urlParams.orderId;

Ich habe ein JavaScript-Tool entwickelt, um dies in einem einfachen Schritt zu tun

Kopieren Sie zuerst diesen Skriptlink in den Kopf Ihres HTML-Codes:

<script src="https://booligoosh.github.io/urlParams/urlParams.js"></script>

Dann einfach den Wert von c mit urlParams.c oder urlParams['c']..__ abrufen. Einfach!

Sie können hier eine echte Demo mit Ihren Werten sehen.

Denken Sie auch daran, dass ich dies entwickelt habe, aber es ist eine einfache und sorglose Lösung für Ihr Problem. Dieses Tool enthält auch eine Hexadezimal-Dekodierung, die oft hilfreich sein kann.

Ich bevorzuge es, verfügbare Ressourcen zu verwenden, anstatt neu zu erfinden, wie diese Parameter analysiert werden.

1. Analysieren Sie die URL als Objekt
2. Extrahieren Sie den Suchparameterteil
3. Transformieren Sie die searchParams von einem Iterator in ein Array mit Array-Erweiterung.
4. Reduzieren Sie das Schlüsselwert-Array in ein Objekt.

const url = 'http://www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5';
const params = [... new URL(url).searchParams.entries()]
  .reduce((a, c) => Object.assign(a, {[c[0]]:c[1]}), {})

console.log(params);

Ein Liner und IE11 freundlich:

> (window.location.href).match('c=([^&]*)')[1]
> "m2-m3-m4-m5"

Hier ist eine Lösung, die ich etwas lesbarer finde - aber für <IE8 ist ein Shim .forEach() erforderlich:

var getParams = function () {
  var params = {};
  if (location.search) {
    var parts = location.search.slice(1).split('&');

    parts.forEach(function (part) {
      var pair = part.split('=');
      pair[0] = decodeURIComponent(pair[0]);
      pair[1] = decodeURIComponent(pair[1]);
      params[pair[0]] = (pair[1] !== 'undefined') ?
        pair[1] : true;
    });
  }
  return params;
}

Hier ist meine Lösung: jsfiddle

Die folgende Methode gibt ein Wörterbuch zurück, das die Parameter der angegebenen URL enthält. Falls keine Parameter vorhanden sind, sind sie null.

function getParams(url){
    var paramsStart = url.indexOf('?');
    var params = null;

    //no params available
    if(paramsStart != -1){
        var paramsString = url.substring(url.indexOf('?') + 1, url.length);

        //only '?' available
        if(paramsString != ""){
            var paramsPairs = paramsString.split('&');

            //preparing
            params = {};
            var empty = true;
            var index  = 0;
            var key = "";
            var val = "";

            for(i = 0, len = paramsPairs.length; i < len; i++){
                index = paramsPairs[i].indexOf('=');

                //if assignment symbol found
                if(index != -1){
                    key = paramsPairs[i].substring(0, index);
                    val = paramsPairs[i].substring(index + 1, paramsPairs[i].length);

                    if(key != "" && val != ""){

                        //extend here for decoding, integer parsing, whatever...

                        params[key] = val;

                        if(empty){
                            empty = false;
                        }
                    }                    
                }
            }

            if(empty){
                params = null;
            }
        }
    }

    return params;
}

Lernen aus vielen Antworten (wie VaMoose 's, Gnarf ' s oder Blixt 's).

Sie können ein Objekt erstellen (oder das Location-Objekt verwenden) und eine Methode hinzufügen, mit der Sie die URL-Parameter decodiert und im JS-Stil abrufen können:

Url = {
    params: undefined,
    get get(){
        if(!this.params){
            var vars = {};
            if(url.length!==0)
                url.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value){
                    key=decodeURIComponent(key);
                    if(typeof vars[key]==="undefined") {
                        vars[key]= decodeURIComponent(value);
                    }
                    else {
                        vars[key]= [].concat(vars[key], decodeURIComponent(value));
                    }
                });
            this.params = vars;
        }
        return this.params;
    }
};

Dadurch kann die Methode nur mit Url.get aufgerufen werden.

Beim ersten Abrufen des Objekts von der URL wird das nächste Mal die gespeicherten geladen.

Beispiel

In einer URL wie ?param1=param1Value&param2=param2Value&param1=param1Value2 können Parameter abgerufen werden:

Url.get.param1 //["param1Value","param1Value2"]
Url.get.param2 //"param2Value"

So extrahieren Sie alle URL-Parameter aus dem Suchobjekt in window.location als json

export const getURLParams = location => {
    const searchParams = new URLSearchParams(location.search)
    const params = {}

    for (let key of searchParams.keys()) {
        params[key] = searchParams.get(key)
    }

    return params
}

console.log(getURLParams({ search: '?query=someting&anotherquery=anotherthing' }))

// --> {query: "someting", anotherquery: "anotherthing"}