sessionStorage的有趣之處---緩存頁面滾動的位置
阿新 • • 發佈:2019-02-16
ssi 針對 () 了解 win 返回鍵 本地 本地存儲 兩個
(string key) :將指定的鍵名(key)從 sessionStorage 對象中移除。
void sessionStorage.clear() :清除 sessionStorage 對象所有的項。
當前給出setItem和getItem的部分代碼
方法
string sessionStorage.key(int index) :返回當前 sessionStorage 對象的第index序號的key名稱。若沒有返回null。 string sessionStorage.getItem(string key) :返回鍵名(key)對應的值(value)。若沒有返回null。 void sessionStorage.setItem(string key, string value) :該方法接受一個鍵名(key)和值(value)作為參數,將鍵值對添加到存儲中;如果鍵名存在,則更新其對應的值。 void sessionStorage.removeItemlocalStorage 和 sessionStorage
客戶端存儲數據的兩個對象為: localStorage - 沒有時間限制的數據存儲,作用在同源窗口中 sessionStorage - 針對一個 session 的數據存儲(關閉窗口,存儲的數據清空) 了解完sessionStorage之後是不是很符合我們的需求呢?將數據存到 session中,管你前進後退還是刷新,數據依然在,關閉窗口後再進頁面才會清空數據,那麽完全符合需求 再理一下實現思路,①頁面滾動,將滾動位置存到session中 → ②再次進到頁面中,到session中取出上次保存的瀏覽位置 → ③滾動到對應位置setItem存儲value
用途:將value存儲到key字段 用法:.setItem( key, value) 代碼示例:sessionStorage.setItem("key", "value"); localStorage.setItem("site", "js8.in");
getItem獲取value
用途:獲取指定key本地存儲的值 用法:.getItem(key) 代碼示例:var value = sessionStorage.getItem("key"); var site = localStorage.getItem("site"); //滾動時保存滾動位置 $(window).scroll(function(){ if($(document).scrollTop()!=0){ sessionStorage.setItem("offsetTop", $(window).scrollTop());//保存滾動位置 } }); //onload時,取出並滾動到上次保存位置 window.onload = function() { var _offset = sessionStorage.getItem("offsetTop"); $(document).scrollTop(offsetTop); };
sessionStorage的有趣之處---緩存頁面滾動的位置