URL

Baseline Widely available *

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

* Some parts of this feature may have varying levels of support.

Hinweis: Diese Funktion ist in Web Workers verfügbar.

Das URL Interface wird verwendet, um URLs zu parsen, zu konstruieren, zu normalisieren und zu kodieren. Es funktioniert, indem es Eigenschaften bereitstellt, die es ermöglichen, die Komponenten einer URL einfach zu lesen und zu ändern.

Normalerweise erstellen Sie ein neues URL-Objekt, indem Sie die URL als String beim Aufrufen des Konstruktors angeben oder indem Sie eine relative URL und eine Basis-URL bereitstellen. Sie können dann die geparsten Komponenten der URL einfach lesen oder Änderungen an der URL vornehmen.

Konstruktor

URL()

Erstellt und gibt ein URL Objekt aus einem URL-String und optionalem Basis-URL-String zurück. Wirft eine Ausnahme, wenn die übergebenen Argumente keine gültige URL definieren.

Instanz-Eigenschaften

hash

Ein String, der ein '#' gefolgt vom Fragment-Identifier der URL enthält.

host

Ein String, der die Domain (das ist der Hostname) gefolgt von (falls ein Port angegeben wurde) einem ':' und dem Port der URL enthält.

hostname

Ein String, der die Domain der URL enthält.

href

Ein Stringifier, der einen String enthält, der die gesamte URL darstellt.

origin Schreibgeschützt

Gibt einen String zurück, der den Ursprung der URL enthält, das heißt ihr Schema, ihre Domain und ihren Port.

password

Ein String, der das Passwort enthält, das vor dem Domainnamen angegeben ist.

pathname

Ein String, der ein anfängliches '/' gefolgt vom Pfad der URL enthält, ohne den Query-String oder das Fragment.

port

Ein String, der die Portnummer der URL enthält.

protocol

Ein String, der das Protokollschema der URL enthält, einschließlich dem abschließenden ':'.

Ein String, der die Parameterzeichenkette der URL angibt; falls Parameter vorhanden sind, enthält dieser String alle mit dem führenden ? Zeichen beginnend.

searchParams Schreibgeschützt

Ein URLSearchParams Objekt, das verwendet werden kann, um auf die einzelnen Abfrageparameter in search zuzugreifen.

username

Ein String, der den Benutzernamen enthält, der vor dem Domainnamen angegeben ist.

Statische Methoden

canParse()

Gibt einen booleschen Wert zurück, der angibt, ob eine aus einem URL-String und optionalem Basis-URL-String definierte URL analysiert und gültig ist.

createObjectURL()

Gibt einen String zurück, der eine eindeutige Blob-URL enthält, das heißt, eine URL mit blob: als Schema, gefolgt von einem undurchsichtigen String, der das Objekt im Browser eindeutig identifiziert.

parse()

Erstellt und gibt ein URL Objekt aus einem URL-String und optionalem Basis-URL-String zurück oder gibt null zurück, wenn die übergebenen Parameter eine ungültige URL definieren.

revokeObjectURL()

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

Instanz-Methoden

toString()

Gibt einen String zurück, der die gesamte URL enthält. Es ist ein Synonym für URL.href, obwohl der Wert damit nicht geändert werden kann.

toJSON()

Gibt einen String zurück, der die gesamte URL enthält. Es gibt denselben String zurück wie die href Eigenschaft.

Verwendungshinweise

Der Konstruktor nimmt einen url-Parameter und einen optionalen base-Parameter, der als Basis verwendet wird, wenn der url-Parameter eine relative URL ist:

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

Der Konstruktor wird eine Ausnahme auslösen, wenn die URL nicht in eine gültige URL geparst werden kann. Sie können den obigen Code entweder in einem try...catch Block aufrufen oder die canParse() statische Methode verwenden, um zuerst zu überprüfen, ob die URL gültig ist:

js
if (URL.canParse("../cats", "http://www.example.com/dogs")) {
  const url = new URL("../cats", "http://www.example.com/dogs");
  console.log(url.hostname); // "www.example.com"
  console.log(url.pathname); // "/cats"
} else {
  console.log("Invalid URL"); //Invalid URL
}

URL-Eigenschaften können gesetzt werden, um die URL zu konstruieren:

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

URLs werden gemäß den in RFC 3986 gefundenen Regeln kodiert. Zum Beispiel:

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

Das URLSearchParams Interface kann verwendet werden, um die Abfragezeichenfolge der URL zu erstellen und zu manipulieren.

Um die Suchparameter der URL des aktuellen Fensters zu erhalten, können Sie dies tun:

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

Die toString() Methode von URL gibt einfach den Wert der href Eigenschaft zurück, sodass der Konstruktor direkt verwendet werden kann, um eine URL zu normalisieren und zu kodieren.

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

Spezifikationen

Specification
URL
# url

Browser-Kompatibilität

Report problems with this compatibility data on GitHub
desktopmobileserver
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Deno
Node.js
URL
URL() constructor
canParse() static method
createObjectURL() static method
hash
host
hostname
href
origin
parse() static method
password
pathname
port
protocol
revokeObjectURL() static method
search
searchParams
toJSON
toString
username

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
Partial support
Partial support
No support
No support
See implementation notes.
Requires a vendor prefix or different name for use.
Has more compatibility info.

Siehe auch