Böngészési előzmények kezelése - webes felületek api, mdn
A DOM ablakobjektum hozzáférést biztosít a böngésző történetéhez a történeti objektumon keresztül. Kiterjeszti a hasznos tulajdonságokat és módszereket, amelyek lehetővé teszik, hogy előrelépést és visszafelé haladhasson a felhasználói előzmények között, és - a HTML5-ről kiindulva - kezelje a történeti verem tartalmát.
Egy utazás a történelem során
Keresse fel a történetet a háttérkép segítségével (). előre () és go ().
Mozgás előre és hátra
Visszalépés:
Ez ugyanúgy működik, mintha a felhasználó a böngésző eszköztárának Vissza gombjára kattintott volna.
Hasonló módon előreléphet (mintha a felhasználó rákattintott volna a Továbbítás gombra), így:
A történelem bizonyos pontjára való áttérés
Használhatja a go () metódust. egy adott oldal betöltése a munkamenet-előzményből, amelyet az aktuális oldal relatív pozíciója határoz meg (az aktuális oldal relatív indexe 0).
Visszalépés az oldalra (a háttér () függvényében:
Tovább az oldalra (vagy az előhíváshoz ()):
Ezenkívül előreléphetsz a 2 oldalra, átmenő 2, és így tovább.
A hosszúság tulajdonságának megtekintésével meghatározhatja az oldalak számát a történeti veremben:
Megjegyzés: az Internet Explorer támogatja az elhaladó URL-eket (); Ez nem szabványosított, és nem támogatott a Gecko-ban.
Történeti bejegyzések hozzáadása és szerkesztése
A HTML5-ben a módszerek history.pushState () és history.replaceState () kerültek bevezetésre. amelyek lehetővé teszik a korábbi bejegyzések hozzáadását és módosítását. Ezek a módszerek együtt dolgoznak az window.onpopstate eseményen.
A history.pushState () használatával megváltoztathatja az XMLHttpRequest objektumok referrer HTTP fejlécében használt hivatkozást. A Referrer a dokumentum URL-je, amelyben az XMLHttpRequest objektumot létrehozták.
A pushState () módszer
A pushState () három paramétert tartalmaz: egy állapotobjektumot, egy fejlécet (most már figyelmen kívül hagyja) és egy opcionális URL-t. Nézzük mindhárom paramétert részletesebben:
Az állami objektum lehet bármi, amit sorba lehet sorolni. Mivel a Firefox a felhasználó meghajtójára menti, visszaállíthatja azt, miután a felhasználó újraindítja a böngészőt. 640 kilobájtra korlátozást írtunk le erre az objektumra. Ha nagyobb objektumot ad át a pushState () függvényhez. a módszer kivételt hoz. Ha több helyre van szüksége, használja a sessionStorage és / vagy a localStorage alkalmazást.
fejléc - A Firefox jelenleg figyelmen kívül hagyja ezt a lehetőséget, bár elkezdheti használni a jövőben. Az üres karakterlánc átadása biztonságos lesz a módszer következő megvalósításához. Bár hozzá lehet adni egy címet az államnak, amelyre a címeden szerepel.
URL - Az új előzmény-bejegyzés URL-címe. Vegye figyelembe, hogy a böngésző nem próbálja meg letölteni ezt az URL-t a pushState () meghívása után. bár később is próbálkozhat, például ha a felhasználó újraindítja a böngészőt. Az URL-nek nem kell abszolútnak lennie, hanem az aktuális oldalhoz viszonyítva. Az új URL-nek ugyanabba a tartományba, protokollba és portba kell mennie, ellenkező esetben a pushState () esküszik. A paraméter opcionális, ha nincs megadva, akkor az aktuális dokumentum URL-címe kerül felhasználásra.
Megjegyzés: A Gecko 2.0-ban (Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1) a Gecko 5.0-hoz (Firefox 5.0 / Thunderbird 5.0 / SeaMonkey 2.2) a továbbított objektumot sorba rendezték a JSON-hoz. Kezdve Gecko 6,0 (Firefox 6.0 / Thunderbird 6.0 / SeaMonkey 2.3), a tárgy megmunkálása az algoritmus strukturált klónozás. Lehetővé teszi, hogy a tárgyak szélesebb körét átviszi.
Bizonyos értelemben a pushState () hívása hasonló a beállításhoz window.location = "#foo" -hoz. mindkét esetben létrejön és aktiválódik egy, az aktuális dokumentumhoz társított másik előzmény-bejegyzés. De a pushState () számos előnnyel rendelkezik:
Érdemes megjegyezni, hogy pushState () soha nem hívja a hashchange eseményt. még akkor is, ha az új URL csak a hash által különbözik.
Az XUL-dokumentumokban létrehozza a megadott XUL-elemet.
Más dokumentumokban egy olyan elemet hoz létre, amelynek null névtér-URI-ja van.
A replaceState () módszer
A history.replaceState () ugyanaz, mint a history.pushState (). de a replaceState () helyettesíti a legutóbbi előzményeket ahelyett, hogy létrehozna egy újat.
A replaceState () különösen hasznos, ha a felhasználói műveletekre válaszként frissíteni szeretné az aktuális előzmény-rekord állapotobjektumát vagy URL-jét.
Megjegyzés: A Gecko 2.0-ban (Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1) a Gecko 5.0-hoz (Firefox 5.0 / Thunderbird 5.0 / SeaMonkey 2.2) a továbbított objektumot sorba rendezték a JSON-hoz. Kezdve Gecko 6,0 (Firefox 6.0 / Thunderbird 6.0 / SeaMonkey 2.3), a tárgy megmunkálása az algoritmus strukturált klónozás. Lehetővé teszi, hogy a tárgyak szélesebb körét átviszi.
A popstate esemény
A történelem megváltoztatásakor egy popstate esemény indul. Ha a történeti rekordot a pushState vagy a replaceState felhívásával hozták létre. a popstate esemény állami tulajdonát a történeti rekord egy példánya tartalmazza.
Lásd a window.onpopstate használatának példáját.
Az aktuális állapot olvasása
Amikor az oldal betöltődik, az állapotobjektum nem lehet nulla. Ez akkor történhet meg, ha az oldal egy állapotobjektumot (pushState () vagy replaceState ()) telepített, majd a felhasználó újratölti a böngészőt. Amikor az oldal újratöltődik, egy onload esemény következik be. de nem popstátus. Ha azonban elolvasod a history.state fájlt, akkor kapsz egy olyan állami objektumot, amely a popstate esemény bekövetkezte esetén keletkezik.
Elolvashatja az aktuális előzményrekord állapotobjektumát, anélkül, hogy a popstate eseményt a history.state tulajdonság használatával várná:
Az AJAX webhely teljes példányát lásd: Ajax navigációs példa.