Predstavené od Gecko2 (Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1)
HTML5 zavádza dve metódy, histtory.pushState() a history.replaceState(), ktoré umožňujú pridávanie a úpravu historických entít. Zároveň tieto metódy fungujú s udalosťou window.onpostate.
Upraviť referrer pomocou metódy history.pushState(), ktorú možno použiť v http hlavičke vytvorenej pre xmlhttpRequest objekt po zmene stavu. Tento referer bude URL dokumentu v čase vytvorenia XMLHttpRequest.
pushState sa používa na pridanie záznamu aktuálnej stránky do histórie, zatiaľ čo replaceState a pushState sa používajú úplne rovnako, jediný rozdiel je v tom, že sa používa na úpravu záznamu aktuálnej stránky v histórii.
príklad
Predpokladajme, že http://mozilla.org/foo.html stránka vykoná JS
var stateObj = { foo: "bar" }; history.pushState(stateObj, "page 2", "bar.html");
Táto metóda spôsobí, že URL adresný riadok zobrazí http://mozilla.org/bar.html,Ale prehliadač bar.html stránku nenačíta, aj keby existovala。
Teraz opäť predpokladajme, že používateľ pokračuje v prístupe k http://google.com a klikne späť. V tomto momente bude adresný riadok URL http://mozilla.org/bar.html stránka dostane udalosť popstate (chrome), ktorá bude obsahovať kópiu stateObj. Táto stránka vyzerá ako foo.html. +
V tomto bode klikneme späť a URL sa zmení http://mozilla.org/foo.html,document zobrazí sa ďalšia udalosť popstate a objekt nulového stavu. Tento návrat nemení obsah dokumentu. (Možno sa po čase pokúsi načítať...) chrome)
Metóda pushState
pushState() má tri parametre: stavový objekt, názov (teraz ignorovaný, nespracovaný), URL (voliteľné). Konkrétne informácie:
· stavový objekt – Stavový objekt je Javascrip{filter}t, ktorý sa vzťahuje na novú historickú entitu vytvorenú metódou pushState(). Používa sa na ukladanie informácií o záznamoch, ktoré chcete vložiť do histórie. Objektom stavu môže byť ľubovoľný reťazec Json. Keďže Firefox používa pevný disk používateľa na prístup k objektu stavu, maximálna úložná kapacita tohto objektu je 640k. Ak je väčšia ako táto hodnota, metóda pushState() vyhodí výnimku. Ak potrebujete viac miesta na uskladnenie, použite lokálne úložisko.
· názov – Firefox tento parameter teraz ignoruje, hoci môže byť použitý v budúcnosti. Najbezpečnejší spôsob, ako ho teraz použiť, je prejsť prázdny reťazec, aby sa predišlo budúcim úpravám. Alebo môžete prejsť krátkym vlastníctvom na označenie štátu
· URL - Tento parameter sa používa na odovzdanie URL novej entity histórie, všimnite si, že prehliadač túto URL po zavolaní metódy pushState() nenačíta. Ale možno sa po čase pokúsi načítať túto URL. Napríklad, po reštarte prehliadača používateľom nemusí byť nová URL absolútna cesta. Ak ide o relatívnu cestu, bude relatívna k existujúcej URL. Nová URL musí byť kodoména s existujúcou URL, inak pushState() vyhodí výnimku. Tento parameter je voliteľný a ak je prázdny, zobrazí sa ako aktuálna URL adresa dokumentu.
V istom zmysle je volanie metódy pushState() podobné nastaveniu window.locatio{filter}n = "#foo", pričom obe vytvárajú a aktivujú ďalšiu historickú entitu priradenú k aktuálnemu dokumentu, ale pushState() má niekoľko ďalších výhod:
Nová URL môže byť ľubovoľná URL, ktorá je v rovnakej doméne ako aktuálna URL, na rozdiel od toho, aby windows.locatio{filter}n zostávala v tom istom dokumente, ak je nastavený iba hash.
Ak nemusíte, URL môžete nechať neupravenú. Pre porovnanie, nastavte window.locatio{filter}n = "#foo"; Generujú sa iba nové historické entity, ak váš aktuálny hash nie je #foo
Môžete priradiť ľubovoľné údaje k vašej novej historickej entite. Pri prístupe založenom na hashoch je potrebné všetky relevantné dáta zakódovať do krátkeho reťazca.
Upozorňujeme, že metóda pushState() nespôsobuje hashchange čas, aj keď sú staré a nové url len odlišné hashe.
metóda replaceState()
history.replaceState() sa používa podobne ako pushState(), s tým rozdielom, že replaceState() sa používa na úpravu aktuálnej entity histórie namiesto vytvorenia novej. Táto metóda môže byť niekedy užitočná, keď potrebujete aktualizovať stavový objekt alebo entitu aktuálnej histórie v reakcii na určité správanie používateľa, a môžete ju použiť na aktualizáciu URL stavového objektu alebo entity aktuálnej histórie.
Podujatie PopState
Keď sa historická entita zmení, nastane udalosť popstate. Ak je historická entita generovaná metódami pushState a replaceState, atribút stav udalosti popstate bude obsahovať kópiu stavového objektu z historickej entity
Viac informácií nájdete na window.onpopstate
Prečítajte si aktuálny stav
Prečítajte si existujúci stav
Keď sa stránka načíta, môže mať neprázdny stavový objekt. To sa môže stať, keď stránka nastaví stavový objekt (pomocou pushState alebo replaceState) a používateľ reštartuje prehliadač. Keď sa stránka znovu načíta, stránka dostane udalosť načítania, ale neobjaví sa žiadna udalosť popstate. Ak si však prečítate vlastnosť history.state, dostanete tento objekt stavu až po udalosti popstate
Dokumentácia History.pushState(): https://developer.mozilla.org/zh-CN/docs/Web/API/History/pushState
Parameter prijímajúcej URL je typ reťazca, ktorý sa používa na zmenu URL aktuálneho adresného riadku. Jedna vec, ktorú treba poznamenať, je, že tento parameter nemôže byť rovnaký ako cross-domain, teda protokol, doménové meno a port musia byť rovnaké.
Nezachytený DOMException: Nepodarilo sa vykonať 'pushState' na 'Histórii': Objekt stavu histórie s URL 'http://www.test.com/' nemôže byť vytvorený v dokumente s pôvodom ' https://www.itsvse.com' a URL 'https://www.itsvse.com/'.
na <anonymous>:1:9
Správny kód:
|
Zverejnené 12. 9. 2017 13:55:04
|
|
|
|
Zverejnené 27. 10. 2017 9:51:10