Nella lezione precedente, abbiamo visto come è possibile utilizzare window.location. In questa lezione, invece, vediamo cosa è e a cosa serve l'oggetto window.history per interagire, con JavaScript, con la cronologia del browser.
Lista dei metodi
| Metodo | Descrizione |
history.back() | Restituisce la larghezza in pixel della finestra del browser. |
history.forward() | Restituisce l'altezza in pixel della finestra del browser. |
history.go() | Restituisce la larghezza in pixel dello schermo dell'utente. |
Vediamo questi metodi in dettaglio
Il metodo history.back()
Il metodo history.back() viene utilizzato per tornare alla pagina precedente nella cronologia del browser dell'utente. Corrispondere a prendere il tasto "Indietro" del browser.
history.back();Il metodo history.forward()
Il metodo history.forward() viene utilizzato per passare alla pagina successiva nella cronologia del browser. È equivalente a fare click sul pulsante "Avanti" del browser.
history.forward();Il metodo history.go()
Il metodo history.go() consente di spostarci avanti o indietro nella cronologia del browser di un numero specificato di pagine, in base al valore specificato.
Sintassi: history.go(numero_pagine). Il numero_pagine corrisponde al numero delle pagine di cui bisogna spostarsi in avanti o indietro nella cronologia. Se il valore è positivo, ci si sposta in avanti. Se è negativo, indietro. Se il valore è 0, la pagina viene ricaricata.
history.go(1); // Una pagina avanti
history.go(-1); // Una pagina indietro
history.go(3); // Tre pagine avanti
history.go(-2); // Due pagine indietro
history.go(0); // Viene ricaricata la paginaEsempi di utilizzo
Vediamo come utilizzare questi metodi: vogliamo creare due pulsanti che, se cliccati, portano uno indietro e uno avanti nella cronologia del browser.
<button onclick="history.back()">Indietro</button>
<button onclick="history.forward()">Avanti</button>Nell'esempio, utilizziamo onclick per eseguire le istruzioni JavaScript.