Jak uzyskać dostęp do historii przeglądanych stron w JavaScript?

W tej lekcji omówimy, jak można manipulować i uzyskać dostęp do historii przeglądanych stron za pomocą JavaScript. Przeglądarka internetowa przechowuje historię odwiedzonych stron, umożliwiając użytkownikowi nawigację do przodu i do tyłu. JavaScript oferuje obiekt window.history, który zawiera metody i właściwości do interakcji z historią sesji przeglądarki. Jednakże, ze względów bezpieczeństwa, bezpośredni dostęp do URL-i odwiedzonych stron jest ograniczony.

Przykład kodu: Navigacja w historii przeglądania

Struktura HTML

Stworzymy prosty interfejs użytkownika z przyciskami do nawigacji w historii przeglądania.

<!DOCTYPE html>
<html>
<head>
    <title>Dostęp do historii przeglądania</title>
</head>
<body>
    <button id="goBack">Wstecz</button>
    <button id="goForward">Dalej</button>

    <script src="script.js"></script>
</body>
</html>
Kod JavaScript

Poniższy skrypt JavaScript dodaje funkcjonalność do przycisków, umożliwiając użytkownikowi nawigację wstecz i dalej w historii przeglądania.

// Plik script.js

// Przypisanie zdarzenia do przycisku "Wstecz"
document.getElementById('goBack').addEventListener('click', function() {
    window.history.back();
});

// Przypisanie zdarzenia do przycisku "Dalej"
document.getElementById('goForward').addEventListener('click', function() {
    window.history.forward();
});

Dostęp do historii przeglądania

Należy pamiętać, że JavaScript nie zapewnia bezpośredniego dostępu do listy URL-i odwiedzonych stron ze względów bezpieczeństwa. Możemy jednak manipulować historią przeglądania za pomocą dostępnych metod:

  • window.history.back() – przenosi użytkownika do poprzedniej strony w historii przeglądania.
  • window.history.forward() – przenosi użytkownika do następnej strony w historii przeglądania.
  • window.history.go(n) – przenosi użytkownika do strony w historii przeglądania, która jest n miejsc dalej (n > 0) lub n miejsc wcześniej (n < 0).

Podsumowanie

W tej lekcji nauczyliśmy się, jak wykorzystać obiekt window.history do manipulowania historią przeglądania w przeglądarce internetowej za pomocą JavaScript. Pokazaliśmy, jak dodać funkcjonalność do przycisków umożliwiających nawigację wstecz i dalej w historii przeglądania. Ważne jest, aby pamiętać, że z powodów bezpieczeństwa bezpośredni dostęp do dokładnych URL-i historii przeglądania jest ograniczony. Użycie obiektu history pozwala jednak na tworzenie interaktywnych i użytkownikowi przyjaznych aplikacji webowych.

Jeżeli chcesz przyśpieszyć swoją naukę tworzenia stron chciałbym polecić mój kurs video JavaScript w którym nauczysz się tego języka od podstaw do zaawansowanych jego aspektów.

Scroll to Top