it-swarm.com.de

Wie liest man GET-Daten von einer URL mit JavaScript?

Ich versuche, Daten von einer Seite auf eine andere zu übergeben.

www.mints.com?name=etwas

Wie liest man name mit JavaScript?

35
jbcedge
function parseURLParams(url) {
    var queryStart = url.indexOf("?") + 1,
        queryEnd   = url.indexOf("#") + 1 || url.length + 1,
        query = url.slice(queryStart, queryEnd - 1),
        pairs = query.replace(/\+/g, " ").split("&"),
        parms = {}, i, n, v, nv;

    if (query === url || query === "") return;

    for (i = 0; i < pairs.length; i++) {
        nv = pairs[i].split("=", 2);
        n = decodeURIComponent(nv[0]);
        v = decodeURIComponent(nv[1]);

        if (!parms.hasOwnProperty(n)) parms[n] = [];
        parms[n].Push(nv.length === 2 ? v : null);
    }
    return parms;
}

Verwenden Sie wie folgt:

var urlString = "http://www.foo.com/bar?a=a+a&b%20b=b&c=1&c=2&d#hash";
    urlParams = parseURLParams(urlString);

was ein Objekt wie folgt zurückgibt: 

{
  "a"  : ["a a"],     /* param values are always returned as arrays */
  "b b": ["b"],       /* param names can have special chars as well */
  "c"  : ["1", "2"]   /* an URL param can occur multiple times!     */
  "d"  : [null]       /* parameters without values are set to null  */ 
} 

So

parseURLParams("www.mints.com?name=something")

gibt

{name: ["something"]}

EDIT: Die ursprüngliche Version dieser Antwort verwendete einen regex-basierten Ansatz für das URL-Parsing. Es verwendete eine kürzere Funktion, aber der Ansatz war fehlerhaft und ich ersetzte ihn durch einen richtigen Parser.

53
Tomalak

Es ist das Jahr 2019 und es ist keine handgeschriebene Lösung oder Bibliothek eines Drittanbieters erforderlich. Wenn Sie die URL der aktuellen Seite im Browser analysieren möchten:

# running on https://www.example.com?name=n1&name=n2
let params = new URLSearchParams(location.search);
params.get('name') # => "n1"
params.getAll('name') # => ["n1", "n2"]

Wenn Sie eine zufällige URL entweder im Browser oder in Node.js analysieren möchten:

let url = 'https://www.example.com?name=n1&name=n2';
let params = (new URL(url)).searchParams;
params.get('name') # => "n1"
params.getAll('name') # => ["n1", "n2"]

Es nutzt die RLSearchParams Schnittstelle, die mit modernen Browsern geliefert wird.

10
Franklin Yu

Ich denke das sollte auch funktionieren:

function $_GET(q,s) {
    s = (s) ? s : window.location.search;
    var re = new RegExp('&amp;'+q+'=([^&amp;]*)','i');
    return (s=s.replace(/^\?/,'&amp;').match(re)) ?s=s[1] :s='';
}

Nenne es einfach so:

var value = $_GET('myvariable');
6
Steven

location.search https://developer.mozilla.org/de/DOM/window.location

die meisten verwenden jedoch eine Art Parsing-Routine, um die Parameter der Abfragezeichenfolge zu lesen.

hier ist eine http://safalra.com/web-design/javascript/parsing-query-strings/

3
Chad Grant

Hier ist eine Lösung. Natürlich muss diese Funktion nicht in eine "window.params" -Option geladen werden - diese kann angepasst werden. 

window.params = function(){
    var params = {};
    var param_array = window.location.href.split('?')[1].split('&');
    for(var i in param_array){
        x = param_array[i].split('=');
        params[x[0]] = x[1];
    }
    return params;
}();

Beispiel-API-Aufruf unter http://www.mints.com/myurl.html?name=something&goal=true :

if(window.params.name == 'something') doStuff();
else if( window.params.goal == 'true') shoutGOOOOOAAALLL();
3
drostie

Die aktuell gewählte Antwort funktionierte in meinem Fall überhaupt nicht gut, was meiner Meinung nach eher typisch ist. Ich habe die Funktion here gefunden und es funktioniert super!

function getAllUrlParams(url) {

  // get query string from url (optional) or window
  var queryString = url ? url.split('?')[1] : window.location.search.slice(1);

  // we'll store the parameters here
  var obj = {};

  // if query string exists
  if (queryString) {

    // stuff after # is not part of query string, so get rid of it
    queryString = queryString.split('#')[0];

    // split our query string into its component parts
    var arr = queryString.split('&');

    for (var i=0; i<arr.length; i++) {
      // separate the keys and the values
      var a = arr[i].split('=');

      // in case params look like: list[]=thing1&list[]=thing2
      var paramNum = undefined;
      var paramName = a[0].replace(/\[\d*\]/, function(v) {
        paramNum = v.slice(1,-1);
        return '';
      });

      // set parameter value (use 'true' if empty)
      var paramValue = typeof(a[1])==='undefined' ? true : a[1];

      // (optional) keep case consistent
      paramName = paramName.toLowerCase();
      paramValue = paramValue.toLowerCase();

      // if parameter name already exists
      if (obj[paramName]) {
        // convert value to array (if still string)
        if (typeof obj[paramName] === 'string') {
          obj[paramName] = [obj[paramName]];
        }
        // if no array index number specified...
        if (typeof paramNum === 'undefined') {
          // put the value on the end of the array
          obj[paramName].Push(paramValue);
        }
        // if array index number specified...
        else {
          // put the value at that index number
          obj[paramName][paramNum] = paramValue;
        }
      }
      // if param name doesn't exist yet, set it
      else {
        obj[paramName] = paramValue;
      }
    }
  }

  return obj;
}
1
plaidcorp

Iv'e korrigierte/verbesserte Tomalaks Antwort mit:

  • Erstellen Sie ein Array nur bei Bedarf.
  • Wenn der Wert ein anderes Gleichungssymbol enthält, wird er innerhalb des Werts angezeigt
  • Es verwendet jetzt den location.search-Wert anstelle einer URL.
  • Eine leere Suchzeichenfolge führt zu einem leeren Objekt.

Code:

function getSearchObject() {
    if (location.search === "") return {};

    var o = {},
        nvPairs = location.search.substr(1).replace(/\+/g, " ").split("&");

    nvPairs.forEach( function (pair) {
        var e = pair.indexOf('=');
        var n = decodeURIComponent(e < 0 ? pair : pair.substr(0,e)),
            v = (e < 0 || e + 1 == pair.length) 
                ? null : 
                decodeURIComponent(pair.substr(e + 1,pair.length - e));
        if (!(n in o))
            o[n] = v;
        else if (o[n] instanceof Array)
            o[n].Push(v);
        else
            o[n] = [o[n] , v];
    });
    return o;
}
1
EliSherer

Ich habe auch eine ziemlich einfache Funktion erstellt ... Sie rufen dazu auf mit: Get ("yourgetname");

und was auch immer da war ... (jetzt, wo ich es geschrieben habe, habe ich festgestellt, dass es Ihnen% 26 gibt, wenn Sie ein & in Ihrem Wert hatten.)

function get(name){
  var url = window.location.search;
  var num = url.search(name);
  var namel = name.length;
  var frontlength = namel+num+1; //length of everything before the value 
  var front = url.substring(0, frontlength);  
  url = url.replace(front, "");  
  num = url.search("&");

 if(num>=0) return url.substr(0,num); 
 if(num<0)  return url;             
}
0
Peter Wegrzyn

Versuchen Sie es wie folgt. Beispiel: www.example.com?id=1

$.urlParam = function (name) {
    var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.search);
    return (results !== null) ? results[1] || 0 : false;
}
console.log($.urlParam('id'));

Ich hoffe es hilft. :)

0
Malar Lala

versuche es auf diese Weise

var url_string = window.location;
var url = new URL(url_string);
var name = url.searchParams.get("name");
var tvid = url.searchParams.get("id");
0
Lasitha Lakmal