Arbeiten mit URLs in JavaScript

In JavaScript muss man manchmal mit Linkadressen arbeiten. Dafür ist die Klasse URL vorgesehen, die es ermöglicht, Teile von Adressen zu erhalten und zu ändern.

Sehen wir uns ihre Arbeit am Beispiel der folgenden Adresse an:

javascriptlet path = 'http://site.ru:3000/dir/eee/page.html#show?a=1&b=2&c=3';

Erstellen wir ein Objekt der Klasse URL, indem wir ihm unsere Adresse als Parameter übergeben:

javascriptlet url = new URL(path);

Lassen Sie uns sehen, welche Eigenschaften das erstellte Objekt hat.

Protokoll

Mit der Eigenschaft protocol kann das Protokoll abgerufen werden:

javascriptlet res = url.protocol;
console.log(res); // gibt 'http://' aus

Host

Mit der Eigenschaft host kann der Domainname mit Port abgerufen werden:

javascriptlet res = url.host;
console.log(res); // gibt 'site.ru:3000' aus

Hostname

Mit der Eigenschaft hostname kann der Domainname abgerufen werden:

javascriptlet res = url.hostname;
console.log(res); // gibt 'site.ru' aus

Port

Mit der Eigenschaft port kann der Port abgerufen werden:

javascriptlet res = url.port;
console.log(res); // gibt '3000' aus

Pfad

Mit der Eigenschaft pathname kann der Domainname weggelassen werden, um den Pfad zu erhalten:

javascriptlet res = url.pathname;
console.log(res); // gibt '/dir/eee/page.html#show?a=1&b=2&c=3' aus

Hash

Mit der Eigenschaft hash kann der Hash-Wert abgerufen werden:

javascriptlet res = url.hash;
console.log(res); // gibt 'show' aus

GET-Parameter

Mit der Eigenschaft search kann die Zeichenkette der GET-Parameter abgerufen werden:

javascriptlet res = url.search;
console.log(res); // gibt 'a=1&b=2&c=3' aus

Mit der Eigenschaft searchParams können die GET-Parameter als Objekt der Klasse URLSearchParams abgerufen werden:

javascriptlet res = url.searchParams;
console.log(res); // gibt ein Objekt der Klasse URLSearchParams aus