小編給大家分享一下h5中history.pushState()如何使用，希望大家閱讀完這篇文章之后都有所收獲，下面讓我們一起去探討吧！
在 HTML 文件中, history.pushState() 方法向?yàn)g覽器歷史添加了一個(gè)狀態(tài)。
pushState() 帶有三個(gè)參數(shù)：一個(gè)狀態(tài)對(duì)象，一個(gè)標(biāo)題（現(xiàn)在被忽略了），以及一個(gè)可選的URL地址。下面將對(duì)這三個(gè)參數(shù)進(jìn)行細(xì)致的檢查：
state object — 狀態(tài)對(duì)象是一個(gè)由 pushState()方法創(chuàng)建的、與歷史紀(jì)錄相關(guān)的JS對(duì)象。當(dāng)用戶定向到一個(gè)新的狀態(tài)時(shí)，會(huì)觸發(fā)popstate事件。事件的state屬性包含了歷史紀(jì)錄的state對(duì)象。（譯者注：總而言之，它存儲(chǔ)JSON字符串，可以用在popstate事件中。）state 對(duì)象可以是任何可以序列化的東西。由于 火狐 會(huì)將這些對(duì)象存儲(chǔ)在用戶的磁盤上，所以用戶在重啟瀏覽器之后這些state對(duì)象會(huì)恢復(fù)，我們施加一個(gè)大640k 的字符串在state對(duì)象的序列化表示上。如果你像pushState() 方法傳遞了一個(gè)序列化表示大于640k 的state對(duì)象，這個(gè)方法將扔出一個(gè)異常。如果你需要更多的空間，推薦使用sessionStorage或者localStorage。
title — 火狐瀏覽器現(xiàn)在已經(jīng)忽略此參數(shù)，將來(lái)也許可能被使用?？紤]到將來(lái)有可能的改變，傳遞一個(gè)空字符串是安全的做法。當(dāng)然，你可以傳遞一個(gè)短標(biāo)題給你要轉(zhuǎn)變成的狀態(tài)。（譯者注：現(xiàn)在大多數(shù)瀏覽器不支持或者忽略這個(gè)參數(shù)，最好用null代替）
URL — 這個(gè)參數(shù)提供了新歷史紀(jì)錄的地址。請(qǐng)注意，瀏覽器在調(diào)用pushState()方法后不會(huì)去加載這個(gè)URL，但有可能在之后會(huì)這樣做，比如用戶重啟瀏覽器之后。新的URL不一定要是絕對(duì)地址，如果它是相對(duì)的，它一定是相對(duì)于當(dāng)前的URL。新URL必須和當(dāng)前URL在同一個(gè)源下;否則，pushState() 將丟出異常。這個(gè)參數(shù)可選，如果它沒(méi)有被特別標(biāo)注，會(huì)被設(shè)置為文檔的當(dāng)前URL。
Note: 在 Gecko 2.0 (Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1) 到 Gecko 5.0 (Firefox 5.0 / Thunderbird 5.0 / SeaMonkey 2.2)中,傳輸?shù)膶?duì)象序列化使用JSON。從Gecko 6.0 (Firefox 6.0 / Thunderbird 6.0 / SeaMonkey 2.3)開(kāi)始,該對(duì)象使用 the structured clone algorithm(結(jié)構(gòu)式克隆算法？)進(jìn)行序列化. 這將允許傳輸更加多樣的對(duì)象。
一些情況下，調(diào)用pushState和設(shè)置 window.location = "#foo"相當(dāng)，這種狀況下，這兩種行為都會(huì)創(chuàng)建和激活另一個(gè)和當(dāng)前頁(yè)面有關(guān)的歷史紀(jì)錄。
但是pushState()有其他優(yōu)勢(shì)：
新URL可以是當(dāng)前URL同源下的任意地址。相反的，設(shè)置window.location會(huì)讓你保持在相同頁(yè)面，除非你只修改hash.
如果不必要，你可以不改變URL，相反的，將window.location設(shè)定為“#foo”；只會(huì)創(chuàng)建一個(gè)新的歷史紀(jì)錄，如果當(dāng)前hash不為#foo.
You can associate arbitrary data with your new history entry. With the hash-based approach, you need to encode all of the relevant data into a short string.你可以關(guān)聯(lián)任意的數(shù)據(jù)到你的新歷史紀(jì)錄中。使用基于hash的方法，你需要將所有相關(guān) 的數(shù)據(jù)編碼為一個(gè)短字符串。
請(qǐng)注意pushState()方法絕不會(huì)導(dǎo)致hashchange 事件被激活，即使新的URL和舊的只在hash上有區(qū)別。
在 XUL 中，它會(huì)創(chuàng)建一個(gè)特殊的XUL元素。
在其他文檔中，則會(huì)創(chuàng)建一個(gè)空的URI命名空間。
語(yǔ)法EDIT
history.pushState(state, title, url);
樣例EDIT
創(chuàng)建了一個(gè)新的由 state, title, 和 url設(shè)定的瀏覽器歷史紀(jì)錄.
JavaScript
重慶分公司
重慶分公司
var state = { 'page_id': 1, 'user_id': 5 };
var title = 'Hello World';var url = 'hello-world.html';
history.pushState(state, title, url);看完了這篇文章，相信你對(duì)“h5中history.pushState()如何使用”有了一定的了解，如果想了解更多相關(guān)知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)成都網(wǎng)站設(shè)計(jì)公司行業(yè)資訊頻道，感謝各位的閱讀！
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無(wú)理由+7*72小時(shí)售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國(guó)服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì)，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。
