JS властивість Document.documentURI
Загальний опис
Властивість documentURI відіграє ключову роль у роботі з документами в мові програмування JavaScript, надаючи повний URI (Uniform Resource Identifier) поточного документа. Ця властивість є читабельною та записуваною, дозволяючи не лише отримувати доступ до URI документа, але й модифікувати його за певних умов. documentURI є надзвичайно корисним у розробці веб-додатків, адже вона дозволяє розробникам легко отримувати та маніпулювати адресою веб-сторінки, що, у свою чергу, може використовуватися для різноманітних завдань, таких як перенаправлення користувачів, аналітика відвідуваності сайту, чи управління контентом на основі URI.
Основне застосування documentURI - це отримання адреси поточного документа. Це може бути корисно, наприклад, для відображення адреси сторінки на самій сторінці або використання URI в логічних умовах для зміни поведінки веб-додатку в залежності від поточної адреси. Простий приклад використання:
console.log(document.documentURI);
Цей код виводить повний URI поточного документа в консоль, дозволяючи розробникам швидко перевірити або використовувати цю інформацію у подальшій логіці програми.
Модифікація URI
Хоча пряме модифікування documentURI не змінює адресу сторінки в браузері (для цього використовують window.location), ця властивість може бути змінена в документах, які були завантажені через XMLHttpRequest або фрейми, що дозволяє розробникам маніпулювати контентом або використовувати його для специфічних цілей, таких як тестування або створення динамічних веб-додатків. Приклад:
// Припускаємо, що documentURI було змінено в контексті XMLHttpRequest
document.documentURI = "https://example.com/new-page.html";
Практичне використання
documentURI може використовуватися для створення умовних інструкцій, які змінюють поведінку веб-додатку в залежності від поточного URI. Наприклад, можна перевіряти URI на відповідність певному шаблону і виконувати код на основі результату:
if (document.documentURI.includes("profile")) {
console.log("Це сторінка профілю користувача.");
}
Це особливо корисно для односторінкових додатків (SPA), де вміст динамічно змінюється без перезавантаження сторінки, і потрібно виконувати різні дії залежно від поточного стану URI.
| Порада: | При створенні функціоналу для збереження поточного стану веб-додатку (наприклад, для закладок або поділу посилання) "documentURI" може використовуватися для зберігання або поділу точного URI документа. Це забезпечує точне відновлення стану додатку або сторінки при повторному відкритті посилання. |
| Порада: | Для розробників, які працюють над веб-скрейпінгом або автоматизацією тестування веб-додатків, "documentURI" служить надійним способом визначення поточної адреси веб-сторінки. Це може допомогти у валідації переходів між сторінками або у зборі даних з конкретних URL. |
| Порада: | Оскільки "documentURI" повертає поточний URI документа як рядок, його можна використовувати для маніпулювання або зміни URI через JavaScript. Наприклад, можна розбити URI на складові (протокол, хост, шлях тощо) для детальнішого аналізу або модифікації. Такий підхід може бути корисним у розробці функціоналу перенаправлення або при створенні більш складних веб-додатків, що вимагають динамічного управління URL. |
Синтаксис
Document.documentURIЗначення
Return
Переглядачі
| Переглядач | |||||
|---|---|---|---|---|---|
1 |
1 |
3 |
12.1 |
17 |
| Переглядач | ||||
|---|---|---|---|---|
4.4 |
18 |
4 |
1 |
| Переглядач | ||
|---|---|---|
- |
- |
Приклади
Цей скрипт JavaScript використовує властивість documentURI для аналізу поточної адреси веб-сторінки та динамічно перенаправляє користувача на іншу сторінку, якщо URI відповідає певному критерію. Наприклад, якщо користувач перебуває на тимчасовій сторінці, скрипт може автоматично перенаправити його на основну сторінку сайту.
if (document.documentURI.includes('/temporary-page')) {
window.location.href = 'https://example.com/new-page';
}У цьому прикладі спочатку отримуємо джерело переходу на сторінку через document.referrer і аналізуємо його доменне ім'я за допомогою конструктора URL. Якщо доменне ім'я закінчується на trusted-domain.com, вважаємо, що користувач прийшов з довіреного джерела. В іншому випадку, користувача перенаправляють на сторінку з повідомленням про заборонений доступ. Цей метод дозволяє підвищити рівень безпеки веб-додатків, обмежуючи доступ до чутливого контенту.
document.addEventListener('DOMContentLoaded', function() {
const referrer = document.referrer;
if (referrer && new URL(referrer).hostname.endsWith('trusted-domain.com')) {
console.log('Користувач прийшов з довіреного домену.');
} else {
console.log('Доступ заборонено. Користувач не прийшов з довіреного домену.');
window.location.href = 'https://example.com/access-denied';
}
});