Signatur
Beschreibung
Das URL-Interface wird verwendet, um URLs zu parsen, zu konstruieren, zu normalisieren und zu kodieren. Es funktioniert, indem es Eigenschaften bereitstellt, mit denen Sie die Bestandteile einer URL leicht lesen und ändern können.
Normalerweise erstellen Sie ein neues URL-Objekt, indem Sie beim Aufruf des Konstruktors die URL als String angeben oder eine relative URL zusammen mit einer Basis-URL bereitstellen. Anschließend können Sie die geparsten Komponenten der URL leicht lesen oder Änderungen an der URL vornehmen.
Der Konstruktor nimmt einen url-Parameter und einen optionalen base-Parameter entgegen, der als Basis verwendet wird, wenn der url-Parameter eine relative URL ist.
Beachten Sie, dass im untenstehenden Fall "dogs" das Dateinamen-Segment ist (weil es keinen abschließenden Schrägstrich hat) und die relative URL "cats" relativ zum Verzeichnis-Teil der Basis-URL interpretiert wird, welcher http://www.example.com/animals/ ist.
Der Konstruktor löst eine Ausnahme aus, wenn die URL nicht zu einer gültigen URL geparst werden kann. Sie können den obigen Code entweder in einem try...catch-Block aufrufen oder die statische Methode canParse() verwenden, um zuvor zu prüfen, ob die URL gültig ist.
URLs werden nach den in RFC 3986 festgelegten Regeln kodiert.
Das URLSearchParams-Interface kann zum Erstellen und Manipulieren des URL-Query-Strings verwendet werden.
Die Methode toString() von URL gibt einfach den Wert der Eigenschaft href zurück, sodass der Konstruktor verwendet werden kann, um eine URL direkt zu normalisieren und zu kodieren.
Parameter
| Name | Typ | Default | Beschreibung |
|---|---|---|---|
| $url Pflicht | string | — | Ein String oder ein beliebiges Objekt mit einem stringifier – einschließlich beispielsweise eines <a>- oder <area>-Elements – das eine absolute oder relative URL repräsentiert. Ist url eine relative URL, wird base benötigt und als Basis-URL verwendet. Ist url eine absolute URL, wird base ignoriert. |
| $base | string | — | Ein String, der die Basis-URL repräsentiert, die verwendet wird, wenn url eine relative URL ist. |
Beispiele
Relative URL mit Basis-URL parsen
const url = new URL("cats", "http://www.example.com/animals/dogs");
console.log(url.hostname); // "www.example.com"
console.log(url.pathname); // "/animals/cats"Gültigkeit einer URL mit canParse() prüfen
if (URL.canParse("cats", "http://www.example.com/animals/dogs")) {
const url = new URL("cats", "http://www.example.com/animals/dogs");
console.log(url.hostname); // "www.example.com"
console.log(url.pathname); // "/animals/cats"
} else {
console.log("Invalid URL");
}URL-Eigenschaften setzen
url.hash = "tabby";
console.log(url.href); // "http://www.example.com/animals/cats#tabby"URL-Kodierung
url.pathname = "démonstration.html";
console.log(url.href); // "http://www.example.com/d%C3%A9monstration.html"Such-Parameter aus der aktuellen URL lesen
// https://some.site/?id=123
const parsedUrl = new URL(window.location.href);
console.log(parsedUrl.searchParams.get("id")); // "123"URL-Konstruktor zum Normalisieren nutzen
const response = await fetch(
new URL("http://www.example.com/démonstration.html"),
);