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.οnclick=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.οnclick=function(){
        var data = document.querySelector('#txt').value;
        //存储数据使用key是唯一,不可重复,每触发都生成;如用一个固定key变量名,触发多次会替换一直一个
        var key = new Date().getTime();
        sessionStorage.setItem(key,data);
    }
    //获取sesstionStorage--getItem
    ready.οnclick=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.οnclick=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>

 

转载于:https://www.cnblogs.com/liubingyjui/p/10302678.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值