zoukankan      html  css  js  c++  java
  • sessionStorage:写入记事本功能[内容写入sessionStorage中,读取,删除]

    知识点:
    1、设置sessionStorage----setItem:sessionStorage.setItem(key,data);
    存储数据使用key是唯一,不可重复,每触发都生成;如用一个固定key变量名,触发多次会替换一直一个:var key = new Date().getTime();
    2、获取sesstionStorage--getItem
    var value= sessionStorage.getItem(key);
    key(index)方法得到每i个key:var key = sessionStorage.key(i);
    得到所有存储数据:var sum = sessionStorage.length;
    3、for循环中删除sessionStorage用sessionStorage.removeItem(key);直接用sessionStorage.clear()替代;
     del.onclick=function(){
            var sum2= sessionStorage.length;
    for(var i=sum2-1;i>=0;i--) {
                    var  key = sessionStorage.key(i);
                    sessionStorage.removeItem(key);
            }
         
        }
    替换成简单的:
    del.onclick=function(){
            sessionStorage.clear();//替代 for循环中的removeItem(key);
     }
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    
    </head>
    <body>
    <input type="text" id ="txt"/>
    <input  type ='button' id="btn" value="保存">
    <input  type ='button' id="ready" value="读取">
    <input  type ='button' id="del" value="删除">
    <script>
        var btn = document.querySelector('#btn');
        var ready = document.querySelector('#ready');
        var del = document.querySelector('#del');
        //设置sessionStorage----setItem
        btn.onclick=function(){
            var data = document.querySelector('#txt').value;
            //存储数据使用key是唯一,不可重复,每触发都生成;如用一个固定key变量名,触发多次会替换一直一个
            var key = new Date().getTime();
            sessionStorage.setItem(key,data);
        }
        //获取sesstionStorage--getItem
        ready.onclick=function(){
            var arrs=[];
            //得到所有存储数据
          var sum = sessionStorage.length;
          for(var i=0;i<sum;i++){
              //得到每i个key
              var  key = sessionStorage.key(i);
              //根据key得到对应value
              var value= sessionStorage.getItem(key);
              // arrs.push(value);
              console.log(value)
    
          }
        }
    
        //删除sessionStorage--removeItem(key)/clear()
        del.onclick=function(){
            var sum2= sessionStorage.length;
            //for 循环i继续计数上一次,删除的数据也按上一次计数,不准,所有用倒数删除
        // for(var i=0;i<sum2;i++) {
            //删除一个数据,长度减去一个
    for(var i=sum2-1;i>=0;i--) {
                    var  key = sessionStorage.key(i);
                    sessionStorage.removeItem(key);
            }
            sessionStorage.clear();//替代 for循环中的removeItem(key);
        }
    </script>
    </body>
    </html>
  • 相关阅读:
    浮动与浮动的清除
    【最全】经典排序算法(C语言)
    Python类中的self到底是干啥的
    浅析Python3中的bytes和str类型
    Shell十三问[转]
    VMware下对虚拟机Ubuntu14系统所在分区sda1进行磁盘扩容
    C语言运算符优先级
    mysql主要性能监控指标
    sql 优化
    npm install安装时忘记--save解决方法
  • 原文地址:https://www.cnblogs.com/liubingyjui/p/10302678.html
Copyright © 2011-2022 走看看