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:

javascriptlet 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:

javascriptlet url = new URL(path);

Laten we kijken welke eigenschappen het gemaakte object heeft.

Protocol

Met de eigenschap protocol kun je het protocol verkrijgen:

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

Host

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

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

Hostnaam

Met de eigenschap hostname kun je de domeinnaam verkrijgen:

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

Poort

Met de eigenschap port kun je de poort verkrijgen:

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

Pad

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

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

Hash

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

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

GET-parameters

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

javascriptlet 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:

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