Pengendalian URL dalam JavaScript

Dalam JavaScript, kadangkala kita perlu bekerja dengan alamat pautan. Untuk tujuan ini, terdapat kelas URL yang membolehkan kita mendapatkan dan mengubah bahagian-bahagian alamat.

Mari kita lihat penggunaannya dengan contoh alamat berikut:

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

Mari buat objek kelas URL dengan menghantar alamat kita sebagai parameter:

javascriptlet url = new URL(path);

Mari kita lihat sifat-sifat yang ada pada objek yang dicipta.

Protokol

Dengan menggunakan sifat protocol, kita boleh mendapatkan protokol:

javascriptlet res = url.protocol;
console.log(res); // akan memaparkan 'http://'

Hos

Dengan menggunakan sifat host, kita boleh mendapatkan nama domain dengan port:

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

Nama Hos

Dengan menggunakan sifat hostname, kita boleh mendapatkan nama domain:

javascriptlet res = url.hostname;
console.log(res); // akan memaparkan 'site.ru'

Port

Dengan menggunakan sifat port, kita boleh mendapatkan port:

javascriptlet res = url.port;
console.log(res); // akan memaparkan '3000'

Laluan

Dengan menggunakan sifat pathname, kita boleh membuang nama domain dan mendapatkan laluan:

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

Hash

Dengan menggunakan sifat hash, kita boleh mendapatkan nilai hash:

javascriptlet res = url.hash;
console.log(res); // akan memaparkan 'show'

Parameter GET

Dengan menggunakan sifat search, kita boleh mendapatkan tali parameter GET:

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

Dengan menggunakan sifat searchParams, kita boleh mendapatkan parameter GET dalam bentuk objek kelas URLSearchParams:

javascriptlet res = url.searchParams;
console.log(res); // akan memaparkan objek kelas URLSearchParams