小編給大家分享一下h5中history.pushState()如何使用，希望大家閱讀完這篇文章之后都有所收獲，下面讓我們一起去探討吧！

成都創(chuàng)新互聯(lián)公司專注于鲅魚圈網(wǎng)站建設服務及定制，我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗。 熱誠為您提供鲅魚圈營銷型網(wǎng)站建設，鲅魚圈網(wǎng)站制作、鲅魚圈網(wǎng)頁設計、鲅魚圈網(wǎng)站官網(wǎng)定制、小程序定制開發(fā)服務，打造鲅魚圈網(wǎng)絡公司原創(chuàng)品牌,更為您提供鲅魚圈網(wǎng)站排名全網(wǎng)營銷落地服務。

在 HTML 文件中,  history.pushState() 方法向瀏覽器歷史添加了一個狀態(tài)。

pushState() 帶有三個參數(shù)：一個狀態(tài)對象，一個標題（現(xiàn)在被忽略了），以及一個可選的URL地址。下面將對這三個參數(shù)進行細致的檢查：

state object— 狀態(tài)對象是一個由 pushState()方法創(chuàng)建的、與歷史紀錄相關的JS對象。當用戶定向到一個新的狀態(tài)時，會觸發(fā)popstate事件。事件的state屬性包含了歷史紀錄的state對象。（譯者注：總而言之，它存儲JSON字符串，可以用在popstate事件中。）state 對象可以是任何可以序列化的東西。由于 火狐 會將這些對象存儲在用戶的磁盤上，所以用戶在重啟瀏覽器之后這些state對象會恢復，我們施加一個最大640k 的字符串在state對象的序列化表示上。如果你像pushState() 方法傳遞了一個序列化表示大于640k 的state對象，這個方法將扔出一個異常。如果你需要更多的空間，推薦使用sessionStorage或者localStorage。

title— 火狐瀏覽器現(xiàn)在已經(jīng)忽略此參數(shù)，將來也許可能被使用?？紤]到將來有可能的改變，傳遞一個空字符串是安全的做法。當然，你可以傳遞一個短標題給你要轉(zhuǎn)變成的狀態(tài)。（譯者注：現(xiàn)在大多數(shù)瀏覽器不支持或者忽略這個參數(shù)，最好用null代替）

URL— 這個參數(shù)提供了新歷史紀錄的地址。請注意，瀏覽器在調(diào)用pushState()方法后不會去加載這個URL，但有可能在之后會這樣做，比如用戶重啟瀏覽器之后。新的URL不一定要是絕對地址，如果它是相對的，它一定是相對于當前的URL。新URL必須和當前URL在同一個源下;否則，pushState() 將丟出異常。這個參數(shù)可選，如果它沒有被特別標注，會被設置為文檔的當前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ù)膶ο笮蛄谢褂肑SON。從Gecko 6.0 (Firefox 6.0 / Thunderbird 6.0 / SeaMonkey 2.3)開始,該對象使用  the structured clone algorithm(結構式克隆算法？)進行序列化. 這將允許傳輸更加多樣的對象。

一些情況下，調(diào)用pushState和設置 window.location = "#foo"相當，這種狀況下，這兩種行為都會創(chuàng)建和激活另一個和當前頁面有關的歷史紀錄。

但是pushState()有其他優(yōu)勢：

新URL可以是當前URL同源下的任意地址。相反的，設置window.location會讓你保持在相同頁面，除非你只修改hash.

如果不必要，你可以不改變URL，相反的，將window.location設定為“#foo”；只會創(chuà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.你可以關聯(lián)任意的數(shù)據(jù)到你的新歷史紀錄中。使用基于hash的方法，你需要將所有相關 的數(shù)據(jù)編碼為一個短字符串。

請注意pushState()方法絕不會導致hashchange 事件被激活，即使新的URL和舊的只在hash上有區(qū)別。

在 XUL 中，它會創(chuàng)建一個特殊的XUL元素。

在其他文檔中，則會創(chuàng)建一個空的URI命名空間。

語法EDIT

history.pushState(state, title, url);

樣例EDIT

創(chuàng)建了一個新的由 state, title, 和 url設定的瀏覽器歷史紀錄.

JavaScript

var state = { 'page_id': 1, 'user_id': 5 };
var title = 'Hello World';var url = 'hello-world.html';
history.pushState(state, title, url);

看完了這篇文章，相信你對“h5中history.pushState()如何使用”有了一定的了解，如果想了解更多相關知識，歡迎關注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝各位的閱讀！

新聞標題：h5中history.pushState()如何使用
本文地址：http://chinadenli.net/article34/gphhpe.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供手機網(wǎng)站建設、做網(wǎng)站、網(wǎng)站內(nèi)鏈、外貿(mào)網(wǎng)站建設、云服務器、動態(tài)網(wǎng)站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)