zoukankan      html  css  js  c++  java
  • html5存储方式localstorage和sessionStorage

    html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage。

    区别:localStorage无时间限制,除非主动删除数据,否则永不过期;sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。

    支持:IE7以及IE7以下不支持

    sessionStorage和localStorage都具有相同的操作方法,例如setItem、getItem和removeItem等。

    setItem:存储value,用法:setItem('key','value');

    getItem:获取value,用法:getItem('key','value');

    removeItem:删除指定key的value,用法:getItem('key','value');

    clear:删清空所有的key/value,用法:getItem('key','value');

    <p>本地存储</p>
        <input type="button" value='存储到localstorage' onclick="setinfo()">
        <input type="button" value="清空所有" onclick="clearAll()">
        <input type="button" value="根据key删除" onclick="deleteone()">
        <input type="button" value="获取" onclick="getinfo()">
        <input type="button" value="遍历" onclick="ergodic()">
        <p id='getvalue'></p>
        <script>
         //存储信息
    function setinfo(){ /*if(typeof window.localStorage == 'undefined'){ alert('浏览暂不支持localStorage') }*/ if(window.localStorage){ var Storage = window.localStorage; Storage.setItem("city", "北京"); Storage.setItem("province", "四川"); }else{ alert("浏览暂不支持localStorage") } } //删除指定key的值 function deleteone(){ window.localStorage.removeItem('city'); } //clear清除所有的key/value function clearAll(){ var localStorage = window.localStorage; var sessionStorage = window.sessionStorage; localStorage.clear(); sessionStorage.clear(); } //获得指定key的value function getinfo(){ var getvalue = window.localStorage.getItem('province'); alert(getvalue); } //遍历localstorage 使用key()和length function ergodic(){ var storage = window.localStorage; //遍历localstorage for (var i=0, len = storage.length; i < len; i++) { var key = storage.key(i); var value = storage.getItem(key); console.log("key:"+key + "值:" + value); } }
        //纪录刷新了多少次页面
    if(sessionStorage.visit){ sessionStorage.visit = Number(sessionStorage.visit) + 1; }else{ sessionStorage.visit = 1; } //key:visit value: 1 document.write('刷新了页面'+sessionStorage.visit+'')

        //利用try/catch处理Safari开启无痕浏览
        //有一种情况,浏览器本身支持localStorage但是无法存入数据,例如Safari的无痕浏览模式

          try{
            window.localStorage.name=1;//能存入不会进入catch
          }catch(e){

            //不能写入
            alert('请关闭无痕浏览')
          }

    </script>

  • 相关阅读:
    C# WinForm 只允许运行一个实例
    C# WinForm 获得文字的像素宽度
    Windows 下使用命令行升级 Npm 和 NodeJS
    每日踩坑 2020-04-15 C# 与 Java 对应 DES 加密算法
    robot自动化测试(二)--- template使用
    robot自动化测试(一)---安装
    linux io优化
    python 远程统计文件
    编程类学习资料整合,更多干货
    两份安卓学习资料,我建议你看完
  • 原文地址:https://www.cnblogs.com/jyichen/p/5828686.html
Copyright © 2011-2022 走看看