Predstavljeno po Gecko2 (Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1)
HTML5 uvaja dve metodi, histtory.pushState() in history.replaceState(), ki omogočata dodajanje in spreminjanje zgodovinskih entitet. Hkrati te metode delujejo z dogodkom window.onpostate.
Referrer spremenite z metodo history.pushState(), ki jo lahko uporabite v http glavi, ustvarjeni za objekt xmlhttpRequest po spremembi stanja. Ta referer bo URL dokumenta, ko je bil XMLHttpRequest ustvarjen.
pushState se uporablja za dodajanje zapisa trenutne strani v zgodovino, medtem ko se replaceState in pushState uporabljata povsem enako, edina razlika je, da se uporablja za spreminjanje zapisa trenutne strani v zgodovini.
primer
Predpostavimo, da http://mozilla.org/foo.html stran izvede JS
var stateObj = { foo: "bar" }; history.pushState(stateObj, "page 2", "bar.html");
Ta metoda bo povzročila, da se naslovna vrstica URL-ja prikaže http://mozilla.org/bar.html,Vendar brskalnik ne naloži bar.html strani, tudi če obstaja。
Spet predpostavimo, da uporabnik še naprej dostopa do http://google.com in klikne nazaj. Takrat bo naslovna vrstica URL-ja http://mozilla.org/bar.html stran prejela dogodek popstate (chrome), ki bo vseboval kopijo stateObj. Ta stran izgleda kot foo.html. +
Na tej točki ponovno kliknemo nazaj in URL se obrne http://mozilla.org/foo.html,document dobi še en dogodek popstate in objekt ničelnega stanja. To vračilo ne spremeni vsebine dokumenta. (Morda bo po nekaj časa poskušal naložiti...) krom)
Metoda pushState
pushState() ima tri parametre: objekt stanja, naslov (zdaj prezrt, neobdelan), URL (neobvezno). Podrobnosti:
· objekt state – Objekt stanja je objekt Javascrip{filter}t, ki se nanaša na novo entiteto zgodovine, ustvarjeno z metodo pushState(). Uporablja se za shranjevanje informacij o vnosih, ki jih želiš vstaviti v zgodovino. Objekt stanja je lahko katerikoli niz Json. Ker Firefox uporablja uporabnikov trdi disk za dostop do objekta stanja, je največja shranjevalna površina tega objekta 640k. Če je večja od te vrednosti, metoda pushState() vrže izjemo. Če potrebujete več prostora za shranjevanje, uporabite lokalno shranjevanje.
· naslov—Firefox ta parameter zdaj ignorira, čeprav ga lahko v prihodnosti uporabimo. Najvarnejši način uporabe zdaj je, da posredujete prazen niz, da preprečite prihodnje spremembe. Lahko pa podaš kratek naslov, ki označuje zvezno državo
· URL - Ta parameter se uporablja za posredovanje URL-ja nove entitete zgodovine, upoštevajte, da brskalnik ne naloži tega URL-ja po klicu metode pushState(). Ampak morda bo po določenem času poskušal naložiti ta URL. Na primer, po ponovnem zagonu brskalnika novi URL ne more biti absolutna pot. Če gre za relativno pot, bo relativna glede na obstoječi URL. Novi URL mora biti so-domena z obstoječim URL-jem, sicer bo pushState() sprožil izjemo. Ta parameter je neobvezen, in če je prazen, bo prikazan kot trenutni URL dokumenta.
V nekem smislu je klicanje metode pushState() podobno kot nastavitev window.locatio{filter}n = "#foo", pri čemer obe ustvarita in aktivirata drugo zgodovinsko entiteto, povezano s trenutnim dokumentom, vendar ima pushState() še nekaj dodatnih prednosti:
Novi URL je lahko katerikoli URL, ki je v isti domeni kot trenutni URL, v nasprotju z window.locatio{filter}n, ki ostane v istem dokumentu, če je nastavljen le hash.
Lahko pustite URL nespremenjen, če ni potrebno. Za primerjavo nastavimo window.locatio{filter}n = "#foo"; Generirajo se le nove zgodovinske entitete, če vaš trenutni hash ni #foo
Poljubne podatke lahko povežete z novo zgodovinsko entiteto. Pri pristopu, ki temelji na zgoščevalcih, je treba vse relevantne podatke kodirati v kratek niz.
Upoštevajte, da metoda pushState() ne povzroči časa za spremembo zgoščenke, tudi če sta stari in novi URL-ji le različna zgoščenka.
metoda replaceState()
history.replaceState() se uporablja podobno kot pushState(), le da se replaceState() uporablja za spreminjanje trenutne zgodovinske entitete namesto ustvarjanja nove. Ta metoda je včasih uporabna, ko morate posodobiti objekt stanja ali entiteto trenutne zgodovine kot odziv na določeno vedenje uporabnika, in jo lahko uporabite za posodobitev URL-ja objekta stanja ali entitete trenutne zgodovine.
Dogodek PopState
Ko se entiteta zgodovine spremeni, se zgodi dogodek popstate. Če je entiteta zgodovine generirana z metodama pushState in replaceState, bo atribut stanja dogodka popstate vseboval kopijo objekta stanja iz entitete history
Za podrobnosti glejte window.onpopstate
Preberite trenutno stanje
Preberite obstoječe stanje
Ko se stran naloži, ima lahko objekt nepraznega stanja. To se lahko zgodi, ko stran nastavi objekt stanja (z uporabo pushState ali replaceState) in uporabnik ponovno zažene brskalnik. Ko se stran ponovno naloži, bo stran prejela dogodek nalaganja, vendar ne bo nobenega dogodka popstate. Če pa preberete lastnost history.state, boste ta objekt stanja dobili po pojavu dogodka popstate
Dokumentacija History.pushState(): https://developer.mozilla.org/zh-CN/docs/Web/API/History/pushState
Parameter prejemnega URL-ja je niz tipa, ki se uporablja za spremembo URL-ja trenutne naslovne vrstice. Pomembno je vedeti, da ta parameter ne sme biti enak kot pri meddomenah, torej morajo biti protokol, domena in port enaki.
Neujeti DOMException: Ni uspelo izvesti 'pushState' na 'Zgodovina': Objekt stanja zgodovine z URL-jem 'http://www.test.com/' ni mogoče ustvariti v dokumentu z izvorom ' https://www.itsvse.com' in URL 'https://www.itsvse.com/'.
pri <anonymous>:1:9
Pravilna koda:
|
Objavljeno na 12. 09. 2017 13:55:04
|
|
|
|
Objavljeno na 27. 10. 2017 09:51:10