localStorage和sessionStorage的区别
//在chrome测试的结果;
知识点1:localStorage和sessionStorage的区别; localStorage生命周期是永久,这意味着除非用户显示在浏览器提供的UI上清除localStorage信息,否则这些信息将永远存在。 sessionStorage生命周期为当前窗口或标签页,一旦窗口或标签页被永久关闭了,那么所有通过sessionStorage存储的数据也就被清空了。
localStorage的方法:
localStorage.clear();
localStorage.getItem();
localStorage.key();
localStorage.setItem();
localStorage.removeItem(); sessionStorage的方法是在localStorage的方法上多了一个length; 注意 localStorage提供了事件;
if(window.addEventListener){
window.addEventListener("storage",handle_storage,false);
}else if(window.attachEvent){
window.attachEvent("onstorage",handle_storage);
};
function handle_storage(e){
e = e || window.e;
console.log(e);
};
/*注意:
storage事件的触发似乎有点问题, 自身页面进行setItem后没有触发window的storage事件,
但是同时访问A.html和B.html, 在A页面中进行 setItem能触发B页面中window的storage事件,
同样的在B页面中进行setItem能触发A页面中window的storage事件.
在IE9中, 页面自身的设值能触发当前页面的storage事件,同样当前页面的设值能触发同一”起源”下其他页面window的storage事件,这看起来似乎更 让人想的通些.
Read More : http://www.cnblogs.com/shihao/archive/2011/12/23/2298854.html
*/
//所以要触发当前页面的localStorage要用自定义事件,我们要自己封装一个;
var Storage = {
setItem : function(k,v){
var se = document.createEvent("StorageEvent");
se.initStorageEvent('storage', false, false, k, localStorage.getItem(k), v, "", "");
window.dispatchEvent(se);
localStorage.setItem(k,v);
},
removeItem : function(k){
localStorage.removeItem(k);
var se = document.createEvent("StorageEvent");
se.initStorageEvent('storage', false, false, k, localStorage.getItem(k), v, "", "");
window.dispatchEvent(se);
}
};
//使用自定义事件吧
window.addEventListener("storage",function(e){
console.log(e);
},false);
//Read More : http://www.cnblogs.com/cczw/p/3196195.html //本地存储在各个浏览器中的存在位置(都是在AppData的不同目录下);
C:\Users\Username\AppData\Local\Google\Chrome\User Data\Default\Local Storage\ ; //找到了,保存的事2进制文件
C:\Users\your-account-name\AppData\Local\Mozilla\Firefox\Profiles\ //没找到
C:\Users\XXX\AppData\Local\Microsoft\Internet Explorer\DOMStore\ // can't find
localStorage和sessionStorage的区别的更多相关文章
- vuex知识笔记,及与localStorage和sessionStorage的区别
菜单快捷导航 Vuex是什么东东,有什么应用场景?localStorage和sessionStorage能否替代它? Vuex知识点State.Getter.Mutaion.Action Vuex模块 ...
- cookie、session、localStorage、sessionStorage的区别
cookie的机制 cookie是存储在用户本地终端上的数据.有时也用cookies,指某些网站为了辨别用户身份,进行session跟踪而存储在本地终端上的数据,通常经过加密. Cookie是服务器发 ...
- localStorage与sessionStorage 的区别
通过一枚页面计数器来区别localStorage与sessionStorage. 通过一个计数变量pageconut,每刷新页面,增加的是localStorage的数量,而sessionStorage ...
- 13.localStorage和sessionStorage的区别
HTMl5的sessionStorage和localStorage html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage. sessionSt ...
- cookie、LocalStorage、sessionStorage三者区别以及使用方式
cookie用来保存客户浏览器请求服务器页面的请求信息 HTML5的WebStorage提供了两种API:localStorage(本地存储)和sessionStorage(会话存储) WebStor ...
- cookie、localStorage、sessionStorage的区别
localStorage - 没有时间限制的数据存储 sessionStorage - 针对一个 session 的数据存储 共同点:sessionStorage.localStorage和cooki ...
- Cookie、LocalStorage 与 SessionStorage的区别在哪里?
基本概念 Cookie Cookie 是小甜饼的意思.顾名思义,cookie 确实非常小,它的大小限制为4KB左右.它的主要用途有保存登录信息,比如你登录某个网站市场可以看到“记住密码”,这通常就是通 ...
- localStorage 和 sessionStorage的区别
存储对象: 在主流浏览器中,添加了html5 Web Storage API 的接口,storage是一个存储对象,它包括会话存储(session storage)或本地存储(local stora ...
- localStorage、sessionStorage的区别
1.localStorage生命周期是永久的, sessionStorage生命周期为当前窗口或标签页,一旦窗口或标签页被永久关闭了,那么所有通过sessionStorage存储的数据也就被清空了. ...
随机推荐
- TestNG之Factory
如果我们的测试方法中,同一个变量需要很多个不同的测试数据,那么这些测试数据由谁提供呢,testng提供了factory的注解,下面我们来一探究竟. 一.单独使用Factory 1.新建一个含有@Fac ...
- 手把手教你如何用ZBrush刻画脸部
今天的ZBrush教程我们将参照一张效果图对模型进行脸部刻画.在进入课堂之前我们有必要对Layers层概念和操作有所了解,然后结合之前学习的雕刻笔刷对模型的特征表情给予重点刻画. 详细的视频教程地址请 ...
- jquery/js特效代码总结(一):tab切换
jquery实现tab切换: html代码: <ul class="tabs" id="tabs01"> <li><a href= ...
- python中list注意事项
今天写python出了一个小插曲,具体情况见代码: >>> a = [1,2,3] >>> import queue >>> q = queue. ...
- 从Maya中导入LightMap到unity中
导入步骤 1.在Maya中为每一个模型烘焙好帖图(tif格式),会发现烘焙好的图和UV是一一对应的 2.把模型和烘焙帖图导入到Unity中 3.选中材质,修改Shader为 Legacy Shader ...
- Android优化——UI检视利器:Hierarchy Viewer
在Android的SDK工具包中,有很多十分有用的工具,可以帮助程序员开发和测试Android应用程序,大大提高其工作效率.其中的一款叫 Hierachy Viewer的可视化调试工具,可以很方便地在 ...
- 大话Git
Git是什么 Git是一个分布式版本控制系统.它可以很方便的记录你的每一次变动,而不需要每次都备份,还能让你和他人很方便的协同开发.这样你每次做了什么改动,瞄一眼就一清二楚了. -- 安装Git 从官 ...
- 使用Apache ab进行http性能测试
Mac自带了Apache环境 打开“终端(terminal)”,输入 sudo apachectl -v,(可能需要输入机器秘密).如下显示Apache的版本 接着输入 sudo apachectl ...
- 【WPF】WPF中调用Winform
1.添加两个引用:WindowsFormsIntegration.dll(负责整合WPF和Windows).System.Windows.Forms.2.在 XAML文件中添加两个引用(粗体部分): ...
- css3 线性渐变和径向渐变
线性渐变:ie6以下不兼容 径向渐变:只支持firefox.Chrome和Safari <!DOCTYPE html> <html> <head> <meta ...