Werken met URL in JavaScript

In JavaScript moet je soms werken met linkadressen. Hiervoor is de klasse URL bedoeld, waarmee je delen van adressen kunt verkrijgen en wijzigen.

Laten we de werking ervan bekijken aan de hand van het volgende adres:

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

Laten we een object van de klasse URL aanmaken, door ons adres als parameter door te geven:

let url = new URL(path);

Laten we kijken welke eigenschappen het gemaakte object heeft.

Protocol

Met de eigenschap protocol kun je het protocol verkrijgen:

let res = url.protocol;
console.log(res); // zal 'http:' uitvoeren

Met de eigenschap host kun je de domeinnaam met poort verkrijgen:

let res = url.host;
console.log(res); // zal 'site.ru:3000' uitvoeren

Met de eigenschap hostname kun je de domeinnaam verkrijgen:

let res = url.hostname;
console.log(res); // zal 'site.ru' uitvoeren

Met de eigenschap port kun je de poort verkrijgen:

let res = url.port;
console.log(res); // zal '3000' uitvoeren

Met de eigenschap pathname kun je de domeinnaam weglaten en het pad verkrijgen:

let res = url.pathname;
console.log(res); // zal '/dir/eee/page.html' uitvoeren

Met de eigenschap hash kun je de hash-waarde verkrijgen:

let res = url.hash;
console.log(res); // zal '#show' uitvoeren

Met de eigenschap search kun je de reeks GET-parameters verkrijgen:

let res = url.search;
console.log(res); // zal '?a=1&b=2&c=3' uitvoeren

Met de eigenschap searchParams kun je de GET-parameters verkrijgen als een object van de klasse URLSearchParams:

let res = url.searchParams;
console.log(res); // zal een object van de klasse URLSearchParams uitvoeren