Làm việc với URL trong JavaScript

Trong JavaScript, đôi khi cần phải làm việc với địa chỉ liên kết. Lớp URL được thiết kế cho việc này, cho phép lấy và thay đổi các phần của địa chỉ.

Hãy xem cách làm việc với nó qua ví dụ địa chỉ sau đây:

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

Hãy tạo một đối tượng của lớp URL, truyền địa chỉ của chúng ta làm tham số:

let url = new URL(path);

Hãy xem đối tượng được tạo có những thuộc tính nào.

Giao thức

Có thể lấy giao thức bằng thuộc tính protocol:

let res = url.protocol;
console.log(res); // sẽ in ra 'http://'

Host

Có thể lấy tên miền cùng với cổng bằng thuộc tính host:

let res = url.host;
console.log(res); // sẽ in ra 'site.ru:3000'

Tên host

Có thể lấy tên miền bằng thuộc tính hostname:

let res = url.hostname;
console.log(res); // sẽ in ra 'site.ru'

Cổng

Có thể lấy cổng bằng thuộc tính port:

let res = url.port;
console.log(res); // sẽ in ra '3000'

Đường dẫn

Có thể loại bỏ tên miền để lấy đường dẫn bằng thuộc tính pathname:

let res = url.pathname;
console.log(res); // sẽ in ra '/dir/eee/page.html#show?a=1&b=2&c=3'

Hash

Có thể lấy giá trị hash bằng thuộc tính hash:

let res = url.hash;
console.log(res); // sẽ in ra 'show'

Tham số GET

Có thể lấy chuỗi tham số GET bằng thuộc tính search:

let res = url.search;
console.log(res); // sẽ in ra 'a=1&b=2&c=3'

Có thể lấy tham số GET dưới dạng đối tượng của lớp URLSearchParams bằng thuộc tính searchParams:

let res = url.searchParams;
console.log(res); // sẽ in ra đối tượng của lớp URLSearchParams