In JavaScript, sometimes you have to work
with links addresses. The URL
class
is designed for this, allowing you to get
and change parts of addresses.
Let's see how to work with it on the following address example:
let path = 'http://site.ru:3000/dir/eee/page.html#show?a=1&b=2&c=3';
Let's create an object of the URL
class, passing our address as a parameter:
let url = new URL(path);
Let's see what properties the created object has.
Protocol
Using the protocol
property,
you can get the protocol type:
let res = url.protocol;
console.log(res); // shows 'http://'
Host
Using the host
property, you
can get a domain name with a port:
let res = url.host;
console.log(res); // shows 'site.ru:3000'
Host name
Using the hostname
property, you
can get the domain name:
let res = url.hostname;
console.log(res); // shows 'site.ru'
Port
Using the port
property,
you can get a port:
let res = url.port;
console.log(res); // shows '3000'
Path
Using the pathname
property, you
can discard a domain name and get a path:
let res = url.pathname;
console.log(res); // shows '/dir/eee/page.html#show?a=1&b=2&c=3'
Hash
Using the hash
property, you
can get the hash value:
let res = url.hash;
console.log(res); // shows 'show'
GET parameters
Using the search
property, you
can get a string with GET parameters:
let res = url.search;
console.log(res); // shows 'a=1&b=2&c=3'
Using the searchParams
property,
you can get GET parameters as an object
of the
URLSearchParams
class:
let res = url.searchParams;
console.log(res); // outputs an object of the URLSearchParams class