Keine dieser Antworten scheint die Frage vollständig zu beantworten, die eine beliebige URL erfordert, nicht speziell die URL der aktuellen Seite.
Methode 1: Verwenden Sie die URL-API (Einschränkung: keine IE11-Unterstützung)
Sie können die URL-API verwenden (nicht von IE11 unterstützt, aber überall verfügbar ).
Dies erleichtert auch den Zugriff auf Suchparameter . Ein weiterer Bonus: Es kann in einem Web Worker verwendet werden, da es nicht vom DOM abhängt.
const url = new URL('http://example.com:12345/blog/foo/bar?startIndex=1&pageSize=10');
Methode 2 (alte Methode): Verwenden Sie den im DOM integrierten Parser des Browsers
Verwenden Sie diese Option, wenn Sie dies auch für ältere Browser benötigen.
// Create an anchor element (note: no need to append this element to the document)
const url = document.createElement('a');
// Set href to any path
url.setAttribute('href', 'http://example.com:12345/blog/foo/bar?startIndex=1&pageSize=10');
Das ist es!
Der eingebaute Parser des Browsers hat seine Arbeit bereits erledigt. Jetzt können Sie einfach die Teile greifen, die Sie benötigen (beachten Sie, dass dies für beide oben genannten Methoden funktioniert):
// Get any piece of the url you're interested in
url.hostname; // 'example.com'
url.port; // 12345
url.search; // '?startIndex=1&pageSize=10'
url.pathname; // '/blog/foo/bar'
url.protocol; // 'http:'
Bonus: Suchparameter
Möglicherweise möchten Sie auch die Such-URL-Parameter aufteilen, da '? StartIndex = 1 & pageSize = 10' für sich genommen nicht allzu verwendbar ist.
Wenn Sie oben Methode 1 (URL-API) verwendet haben, verwenden Sie einfach die searchParams-Getter:
url.searchParams.get('startIndex'); // '1'
Oder um alle Parameter zu erhalten:
function searchParamsToObj(searchParams) {
const paramsMap = Array
.from(url.searchParams)
.reduce((params, [key, val]) => params.set(key, val), new Map());
return Object.fromEntries(paramsMap);
}
searchParamsToObj(url.searchParams);
// -> { startIndex: '1', pageSize: '10' }
Wenn Sie Methode 2 (die alte Methode) verwendet haben, können Sie Folgendes verwenden:
// Simple object output (note: does NOT preserve duplicate keys).
var params = url.search.substr(1); // remove '?' prefix
params
.split('&')
.reduce((accum, keyval) => {
const [key, val] = keyval.split('=');
accum[key] = val;
return accum;
}, {});
// -> { startIndex: '1', pageSize: '10' }