zoukankan      html  css  js  c++  java
  • sessionstorage:本地临时存储

    HTML5 web存储有两个重要对象:

    • localStorage - 没有时间限制的数据存储
    • sessionStorage - 针对一个 session 的数据存储(关闭窗口,存储的数据清空)

    一般涉及到浏览器内状态存储时,首先会想到cookie。

    但是请回忆一下这样的场景,打开某个APP,弹出一个购买会员的广告,果断关掉,然后前进、后退、刷新,广告都不出来了,

    关掉APP后重新打开,广告又来了~~

    这时如果明白sessionstorage,很快也就会清楚这个功能怎么实现的

    实现思路

    ①查询sessionStorage是否有关闭广告标记 sessionStorage.setItem("key", "value")
    ②根据标记隐藏或者显示广告 sessionStorage.getItem("key")

    这样,每次关闭浏览器或者APP,广告都会重新弹出来

    其它应用举例

    阅读文章时,不小心刷新页面,会跳到上次浏览位置

    ①页面滚动,将滚动位置存到session中(如果有分页,则同时存储页码)
    ②再次进到页面中,到session中取出上次保存的浏览位置和存储的页码
    ③(如果有分页,先打开响应页码),滚动到对应位置

    $(window).scroll(function(){
        if($(document).scrollTop()!=0){
        sessionStorage.setItem("offsetTop", $(window).scrollTop());//保存滚动位置
        } 
    });
    
    window.onload = function()
    {
      var _offset = sessionStorage.getItem("offsetTop");
      $(document).scrollTop(offsetTop);
    };
    
    
  • 相关阅读:
    TDSSNIClient initialization failed with error 0x7e, status code 0x60.
    SourceSafe Outof Memory
    机器学习(Part I)机器学习的种类
    机器学习PartIII:测试算法和NFL定理
    Google架构学习
    MediaWiki安装问题总结
    [转]IT项目管理实务
    几本关于统计学习的书
    Googlebot开始检索网站深层内容
    中文搜索引擎技术之网页排序
  • 原文地址:https://www.cnblogs.com/zhangceblogs/p/8980957.html
Copyright © 2011-2022 走看看