牛骨文教育服务平台(让学习变的简单)
博文笔记

web Storage

创建时间:2018-03-28 投稿人: 浏览次数:127

    在浏览器存储当前用户专用数据

    Cookie:兼容性好,不能超过4KB,操作复杂

    Flash:依赖于Flash播放器

    H5 WebStorage:不超过8MB,操作简单

    IndexDB:可存储大量数据,还不是标准数据

    Session:会话,浏览器从打开某一个网站的第一个页面开始,中间可能打开多个页面,直到关闭浏览器整个过程成为“一次

回话”

Web Storage技术:

    浏览器为用户提供两个对象

    类数组对象,会话级数据存储

   作用:在浏览器进程中分配一个内存,存储本次会话使用数据,此次会话中的所有页面都可以共享此数据,浏览器一旦关闭了

数据就消失

   语法:

            sessionStorage[key] = value;             //保存数据

            sessionStorage.setItem(key,value)        //保存数据

            var value = sessionStorage[key]           //获取数据

            var value = sessionStorage.getItem(key)   //获取数据

            sessionStorage.removeItem(key)            //删除一组数据

            sessionStorage.clear()                    //删除所有

            sessionStorage.length                     //数据个数

            var key = sessionStorage.key(i)           //获取第i个key

      什么是:在浏览器所有管理外存(硬盘)中存储着用户专用数据

      本质:类数组对象,本地存储(跨会话)

      作用:永久存储,存储所有会话共享数据    (使用较少)

      语法:

        localStorage[key] = value                        //保存数据

        localStorage.setItem(key,value)                  //保存数据
        
        var value = localStorage[key]                   //获取数据

        var value = localStorage.getItem(key)           //获取数据

        localStorage.removeItem(key)                    //删除一行数据

        localStorage.clear()                            //删除全部数据

        localStorage.length                             //数据个数

        var key = localStorage.key(i)                   //获取key

实例:

使用一个页面进行local保存数据

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
   <a href="get.html">获取数据</a>
   <script>
       //保存数据:
       localStorage["name"]="dongdong";
       localStorage.setItem("point","308");
   </script>
</body>
</html>

另一个页面get数据

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <script>
        var name = localStorage.getItem("name");
        var point = localStorage.getItem("point");
        console.log(name);
        console.log(point);
    </script>
</body>
</html>


声明:该文观点仅代表作者本人,牛骨文系教育信息发布平台,牛骨文仅提供信息存储空间服务。