Gibt es eine Plugin-lose Möglichkeit zum Abrufen Abfragezeichenfolge Werte per jQuery (oder ohne)?

Wenn das so ist, wie? Wenn nicht, gibt es ein Plugin, das das kann?

Einige der hier geposteten Lösungen sind ineffizient. Die Suche nach regulären Ausdrücken jedes Mal zu wiederholen, wenn das Skript auf einen Parameter zugreifen muss, ist völlig unnötig, eine einzige Funktion zum Aufteilen der Parameter in ein Objekt im Stil eines assoziativen Arrays reicht aus. Wenn Sie nicht mit der HTML 5-Verlaufs-API arbeiten, ist dies nur einmal pro Seitenladevorgang erforderlich. Auch die anderen Vorschläge hier können die URL nicht richtig dekodieren.

var urlParams;
(window.onpopstate = function () {
    var match,
        pl     = /\+/g,  // Regex for replacing addition symbol with a space
        search = /([^&=]+)=?([^&]*)/g,
        decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); },
        query  = window.location.search.substring(1);
  
    urlParams = {};
    while (match = search.exec(query))
       urlParams[decode(match[1])] = decode(match[2]);
})();

Beispiel-Abfragezeichenfolge:

?i=main&mode=front&sid=de8d49b78a85a322c4155015fdce22c4&enc=+Hello%20&empty

Ergebnis:

 urlParams = {
    enc: " Hello ",
    i: "main",
    mode: "front",
    sid: "de8d49b78a85a322c4155015fdce22c4",
    empty: ""
}

alert(urlParams["mode"]);
// -> "front"

alert("empty" in urlParams);
// -> true

Dies könnte leicht verbessert werden, um auch Abfragezeichenfolgen im Array-Stil zu verarbeiten. Ein Beispiel dafür ist Hieraber da Parameter im Array-Stil nicht in definiert sind RFC 3986 Ich werde diese Antwort nicht mit dem Quellcode verschmutzen. Für diejenigen, die an einer “verschmutzten” Version interessiert sind, sehen Sie sich die Antwort von Campbeln unten an.

Außerdem, wie in den Kommentaren erwähnt, ; ist ein rechtliches Trennzeichen für key=value Paare. Es würde eine kompliziertere Regex erfordern, um damit umzugehen ; oder &was meiner Meinung nach unnötig ist, weil es selten vorkommt ; verwendet wird, und ich würde sogar noch unwahrscheinlicher sagen, dass beide verwendet werden. Wenn Sie Unterstützung brauchen ; anstatt &tauschen Sie sie einfach in der Regex aus.

Wenn Sie eine serverseitige Vorverarbeitungssprache verwenden, möchten Sie vielleicht ihre nativen JSON-Funktionen verwenden, um die schwere Arbeit für Sie zu erledigen. In PHP kann man zum Beispiel schreiben:

<script>var urlParams = <?php echo json_encode($_GET, JSON_HEX_TAG);?>;</script>

Viel einfacher!

#AKTUALISIERT

Eine neue Fähigkeit wäre, wiederholte Parameter wie folgt abzurufen myparam=1&myparam=2. Da ist kein SpezifikationDie meisten aktuellen Ansätze folgen jedoch der Generierung eines Arrays.

myparam = ["1", "2"]

Also, das ist der Ansatz, um es zu verwalten:

let urlParams = {};
(window.onpopstate = function () {
    let match,
        pl = /\+/g,  // Regex for replacing addition symbol with a space
        search = /([^&=]+)=?([^&]*)/g,
        decode = function (s) {
            return decodeURIComponent(s.replace(pl, " "));
        },
        query = window.location.search.substring(1);

    while (match = search.exec(query)) {
        if (decode(match[1]) in urlParams) {
            if (!Array.isArray(urlParams[decode(match[1])])) {
                urlParams[decode(match[1])] = [urlParams[decode(match[1])]];
            }
            urlParams[decode(match[1])].push(decode(match[2]));
        } else {
            urlParams[decode(match[1])] = decode(match[2]);
        }
    }
})();

Verbesserte Version von Artem Bargers Antwort:

function getParameterByName(name) {
    var match = RegExp('[?&]' + name + '=([^&]*)').exec(window.location.search);
    return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
}

Weitere Informationen zur Verbesserung finden Sie unter: http://james.padolsey.com/javascript/bujs-1-getparameterbyname/

URLSearchParams

Firefox 44+, Opera 36+, Edge 17+, Safari 10.3+ und Chrome 49+ unterstützen die URLSearchParams API:

• Ankündigung und Details zu Chrome
• Opera Ankündigung und Details
• Firefox-Ankündigung und Details

Es gibt einen Google-Vorschlag URLSearchParams-Polyfill für die stabilen Versionen von IE.

Es ist nicht von standardisiert W3Caber es ist ein Lebensstandard von WasWG.

Sie können es verwenden location:

const params = new URLSearchParams(location.search);

oder

const params = (new URL(location)).searchParams;

Oder natürlich auf eine beliebige URL:

const url = new URL('https://example.com?foo=1&bar=2');
const params = new URLSearchParams(url.search);

Sie können Parameter auch mit einer Abkürzung erhalten .searchParams -Eigenschaft für das URL-Objekt wie folgt:

const params = new URL('https://example.com?foo=1&bar=2').searchParams;
params.get('foo'); // "1"
params.get('bar'); // "2" 

Sie lesen/setzen Parameter über die get(KEY), set(KEY, VALUE), append(KEY, VALUE) API. Sie können auch über alle Werte iterieren for (let p of params) {}.

EIN Referenzimplementierung und ein Beispielseite sind für Audits und Tests verfügbar.

Nur eine weitere Empfehlung. Das Plugin Purl ermöglicht das Abrufen aller Teile der URL, einschließlich Anker, Host usw.

Es kann mit oder ohne jQuery verwendet werden.

Die Verwendung ist sehr einfach und cool:

var url = $.url('http://allmarkedup.com/folder/dir/index.html?item=value'); // jQuery version
var url = purl('http://allmarkedup.com/folder/dir/index.html?item=value'); // plain JS version
url.attr('protocol'); // returns 'http'
url.attr('path'); // returns '/folder/dir/index.html'

Seit dem 11. November 2014 wird Purl jedoch nicht mehr gepflegt und der Autor empfiehlt die Verwendung URI.js stattdessen. Das jQuery-Plugin unterscheidet sich darin, dass es sich auf Elemente konzentriert – für die Verwendung mit Zeichenfolgen verwenden Sie einfach URI direkt, mit oder ohne jQuery. Ähnlicher Code würde als solcher aussehen, vollständigere Dokumente Hier:

var url = new URI('http://allmarkedup.com/folder/dir/index.html?item=value'); // plain JS version
url.protocol(); // returns 'http'
url.path(); // returns '/folder/dir/index.html'