URL

Konstruktor

URL()

Erstellt ein URL-Objekt aus einer URL-Zeichenfolge und einer optionalen Basis-URL-Zeichenfolge und gibt es zurück. Löst eine Ausnahme aus, wenn die übergebenen Argumente keine gültige URL definieren.

Instanzeigenschaften

hash

Eine Zeichenfolge, die ein '#' gefolgt vom Fragmentbezeichner der URL enthält.

host

Eine Zeichenfolge, die die Domain (also den hostname) enthält, gefolgt von einem ':' und dem port der URL, sofern ein Port angegeben wurde.

hostname

Eine Zeichenfolge, die die Domain der URL enthält.

href

Ein Stringifier, der eine Zeichenfolge mit der vollständigen URL zurückgibt.

origin Schreibgeschützt

Gibt eine Zeichenfolge zurück, die den Origin der URL enthält, also ihr Schema, ihre Domain und ihren Port.

password

Eine Zeichenfolge, die das vor dem Domainnamen angegebene Passwort enthält.

pathname

Eine Zeichenfolge, die ein führendes '/' gefolgt vom Pfad der URL enthält, ohne Query-String oder Fragment.

port

Eine Zeichenfolge, die die Portnummer der URL enthält.

protocol

Eine Zeichenfolge, die das Protokollschema der URL einschließlich des abschließenden ':' enthält.

search

Eine Zeichenfolge, die die Parameterzeichenfolge der URL angibt. Falls Parameter vorhanden sind, enthält sie alle Parameter und beginnt mit dem führenden Zeichen ?.

searchParams Schreibgeschützt

Ein URLSearchParams-Objekt, mit dem Sie auf die einzelnen in search enthaltenen Query-Parameter zugreifen können.

username

Eine Zeichenfolge, die den vor dem Domainnamen angegebenen Benutzernamen enthält.

Statische Methoden

canParse()

Gibt einen booleschen Wert zurück, der angibt, ob eine durch eine URL-Zeichenfolge und eine optionale Basis-URL-Zeichenfolge definierte URL geparst werden kann und gültig ist.

createObjectURL()

Gibt eine Zeichenfolge mit einer eindeutigen Blob-URL zurück, also einer URL mit blob: als Schema, gefolgt von einer undurchsichtigen Zeichenfolge, die das Objekt im Browser eindeutig identifiziert.

parse()

Erstellt ein URL-Objekt aus einer URL-Zeichenfolge und einer optionalen Basis-URL-Zeichenfolge und gibt es zurück. Wenn die übergebenen Parameter eine ungültige URL definieren, wird null zurückgegeben.

revokeObjectURL()

Widerruft eine zuvor mit URL.createObjectURL() erstellte Objekt-URL.

Instanzmethoden

toString()

Gibt eine Zeichenfolge mit der vollständigen URL zurück. Die Methode ist gleichbedeutend mit URL.href, kann aber nicht zum Ändern des Werts verwendet werden.

toJSON()

Gibt eine Zeichenfolge zurück, die das URL-Objekt repräsentiert. Ihr Wert entspricht dem Rückgabewert von URL.toString(). Die Methode wird automatisch von JSON.stringify() aufgerufen.

Hinweise zur Verwendung

Der Konstruktor nimmt einen url-Parameter und einen optionalen base-Parameter entgegen. Letzterer dient als Basis, wenn der url-Parameter eine relative URL ist.

Beachten Sie, dass im folgenden Beispiel „dogs“ das Dateinamen-Segment ist (da ein abschließender Schrägstrich fehlt). Die relative URL „cats“ wird relativ zum Verzeichnis-Teil der Basis-URL interpretiert, also zu http://www.example.com/animals/. Weitere Informationen finden Sie unter Relative Verweise auf eine URL auflösen.

const url = new URL("cats", "http://www.example.com/animals/dogs");
console.log(url.hostname); // "www.example.com"
console.log(url.pathname); // "/animals/cats"

Der Konstruktor löst eine Ausnahme aus, wenn die URL nicht als gültige URL geparst werden kann. Sie können den obigen Code entweder in einem try...catch-Block aufrufen oder mit der statischen Methode canParse() zunächst prüfen, ob die URL gültig ist:

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");
}

Sie können URL-Eigenschaften setzen, um die URL zu erstellen:

url.hash = "tabby";
console.log(url.href); // "http://www.example.com/animals/cats#tabby"

URLs werden nach den Regeln in RFC 3986 kodiert. Zum Beispiel:

url.pathname = "démonstration.html";
console.log(url.href); // "http://www.example.com/d%C3%A9monstration.html"

Mit der URLSearchParams-Schnittstelle können Sie den Query-String der URL erstellen und bearbeiten.

Um die Suchparameter aus der URL des aktuellen Fensters abzurufen, können Sie Folgendes tun:

// https://some.site/?id=123
const parsedUrl = new URL(window.location.href);
console.log(parsedUrl.searchParams.get("id")); // "123"

Die Methode toString() von URL gibt lediglich den Wert der Eigenschaft href zurück. Daher können Sie mit dem Konstruktor eine URL direkt normalisieren und kodieren.

const response = await fetch(
  new URL("http://www.example.com/démonstration.html"),
);

Spezifikationen

Browser-Kompatibilität

Siehe auch

• Polyfill für URL in core-js
• URL API
• Was ist eine URL?
• URLSearchParams.