URL в javascript

URL (Uniform Resource Locator), или ссылка, является основным элементом для работы с веб-страницами в JavaScript. JavaScript предоставляет набор инструментов для работы с URL-адресами, позволяя получать и изменять различные компоненты URL. В данном посте я расскажу о некоторых методах и свойствах, которые помогут вам эффективно работать с URL в JavaScript.

1. Создание объекта URL:

Для начала работы с URL в JavaScript необходимо создать объект URL с помощью ключевого слова new. Например:

const url = new URL("https://www.example.com");

console.log(url);

Вы получите объект URL, представляющий указанный URL-адрес. Далее вы можете использовать методы и свойства этого объекта для доступа к различным компонентам URL.

2. Получение компонентов URL:

Объект URL предоставляет несколько свойств для доступа к различным компонентам URL. Например, свойство href содержит полный URL-адрес, а свойство hostname содержит имя хоста. Ниже приведены некоторые примеры:

console.log(url.href); // https://www.example.com

console.log(url.hostname); // www.example.com

console.log(url.pathname); // /

console.log(url.search); // ""

console.log(url.hash); // ""

Вы можете получить доступ к другим компонентам, таким как протокол, порт и т. д., используя соответствующие свойства объекта URL.

3. Изменение компонентов URL:

Объект URL также предоставляет методы для изменения различных компонентов URL. Например, метод searchParams.set() позволяет установить значение параметра запроса URL. Ниже приведен пример:

url.searchParams.set("page", 1);

console.log(url.href); // https://www.example.com/?page=1

Вы можете использовать другие методы, такие как searchParams.append() и searchParams.delete(), для добавления или удаления параметров запроса соответственно.

4. Разбор URL-адреса:

Если вам необходимо разобрать URL-адрес и получить отдельные компоненты, такие как параметры запроса или хеш, JavaScript также предоставляет встроенную функцию URLSearchParams. Например:

const searchParams = new URLSearchParams(url.search);

console.log(searchParams.get("page")); // 1

Вы можете использовать методы get(), getAll(), has(), set() и другие для работы с параметрами запроса.

В заключение, работы с URL в JavaScript широко используется для манипулирования адресами веб-страниц. Объект URL предоставляет удобные методы и свойства для работы с различными компонентами URL-адресов. Используя эти возможности, вы можете легко получать и изменять различные параметры URL в своих приложениях на JavaScript.