sessionStroage:

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    </script><script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>

    <title>Title</title>

</head>

<body>

<input type="text" id="userName" value="123"><br>

<button id="btn1Id">设置数据</button>

<button id="btn2Id">设置数据</button>

<input id="btn3Id" type="button" value="设置数据"></input>

<script type="text/javascript">

    document.querySelector("#btn1Id").onclick = function () {

        var userName = document.querySelector("#userName").value;

        window.sessionStorage.setItem("name",userName);

    };

    document.querySelector("#btn2Id").onclick = function () {

        alert(window.sessionStorage.getItem("name"));

    };

    $("#btn3Id").click(function () {

        window.sessionStorage.removeItem("name");

    });

    </script>

</body>

</html>

　　localStroage

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    </script><script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>

    <title>Title</title>

</head>

<body>

<input type="text" id="userName" value="123"><br>

<button id="btn1Id">设置数据</button>

<button id="btn2Id">设置数据</button>

<input id="btn3Id" type="button" value="设置数据"></input>

<script type="text/javascript">

    document.querySelector("#btn1Id").onclick = function () {

        var userName = document.querySelector("#userName").value;

        window.localStorage.setItem("name",userName);

    };

    document.querySelector("#btn2Id").onclick = function () {

        alert(window.localStorage.getItem("name"));

    }

    $("#btn3Id").click(function () {

        window.localStorage.removeItem("name");

    })

</script>

</body>

</html>

　manifest

　

<!DOCTYPE html>

<html lang="en" manifest="dome.appcache">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style type="text/css">

        img{

            width: 300px;

            height: 100px;

            display: block;

        }

    </style>

</head>

<body>

<img src="http://img.redocn.com/sheying/20150213/mulanweichangcaoyuanfengjing_3951976.jpg" alt="">

<img src="http://pic51.nipic.com/file/20141025/8649940_220505558734_2.jpg" alt="">

<img src="http://pic46.nipic.com/20140815/2531170_172548240000_2.jpg" alt="">

<img src="http://pic25.nipic.com/20121112/9252150_150552938000_2.jpg" alt="">

</body>

</html>

　　

HTML5--sessionStorage、localStorage、manifest的更多相关文章

  1. cookie、localStorage、sessionStorage之间的区别

    sessionStorage 和 localStorage 是HTML5 Web Storage API 提供的,可以方便的在web请求之间保存数据.有了本地数据,就可以避免数据在浏览器和服务器间不必 ...

  2. 本地存储sessionStorage 、 localStorage 、cookie整理

    sessionStorage . localStorage .cookie 的区别 sessionStorage 和 localStorage 是HTML5 Web Storage API 提供的,可 ...

  3. sessionStorage、localStorage、cookie

    sessionStorage 和 localStorage 是HTML5 Web Storage API 提供的,可以方便的在web请求之间保存数据.有了本地数据,就可以避免数据在浏览器和服务器间不必 ...

  4. 深入了解浏览器存储：对比Cookie、LocalStorage、sessionStorage与IndexedDB

    摘要: 对比Cookie.LocalStorage.sessionStorage与IndexedDB 作者:浪里行舟 Fundebug经授权转载,版权归原作者所有. 前言 随着移动网络的发展与演化,我 ...

  5. Cookie、Session、localStorage、sessionStorage区别和用法

    Cookie 在学习一个新知识点前,我们应该明白自己的学习目标,要带着疑问去学习,该小节须要了解 Cookies 什么是cookie,cookie的作用 cookie的工作机制,即cookie是运作流 ...

  6. 浏览器本地储存方式有哪些？cookie、localStorage、sessionStorage

    现阶段,浏览器提供的储存方式常用的有三种,cookie.localStorage.sessionStorage 1.cookie 概念:cookie 是浏览器中用于保存少量信息的一个对象 基本特征: ...

  7. 详解Cookie、LocalStorage、SessionStorage

    不管是笔试还是面试相信大家都会经常遇到问Cookie.LocalStorage.SessionStorage 这三个不同的,什么不说先上一波图先: 针对他们大小之分应用场景也有不同: 因为考虑到每个 ...

  8. cookie、session、localStorage、sessionStorage的区别

    cookie的机制 cookie是存储在用户本地终端上的数据.有时也用cookies,指某些网站为了辨别用户身份,进行session跟踪而存储在本地终端上的数据,通常经过加密. Cookie是服务器发 ...

  9. [Html5]sessionStorage和localStorage常见操作

    摘要 [Html5]sessionStorage和localStorage的区别 索引 上篇文章简单介绍了它们的区别,已经常见的用法.那我们能通过. 或者类似dic[key]的方式访问吗?答案是当然可 ...

  10. HTML5本地存储localStorage、sessionStorage及IE专属UserData

    By:王美建 from:http://www.cnblogs.com/wangmeijian/p/4518606.html 转载请保留署名和出处! 在客户端存储数据用的最普遍的方式非cookie莫属, ...

随机推荐

  1. Nodejs中request出现ESOCKETTIMEDOUT解决方案

    做需求的时候,使用Nodejs的request批量请求某一个接口,由于接口超时,出现 ESOCKETTIMEDOUT,程序中断 为了让程序遇到 ESOCKETTIMEDOUT 之后能够继续执行下去,需 ...

  2. Python之路-初识python及环境搭建与测试（Python安装、Anaconda安装、PyCharm安装）

    一.认识Python 起源 Python的作者是著名的“龟叔”Guido van Rossum,他希望有一种语言,这种语言能够像C语言那样,能够全面调用计算机的功能接口,又可以像shell那样,可以轻 ...

  3. Docker设置容器开机自启动

    设置如下: docker update --restart=always 镜像ID 例如:docker update --restart=always e39a959d7bff. 参考:https:/ ...

  4. CentOS 7系统安装nginx+php

    安装介绍1.系统环境CentOS7 2.nginx版本1.12 3.PHP版本7.2 下载地址 4.MySQL版本5.7 安装nginx添加centos7的 nginx yum源 然后执行安装 sud ...

  5. ps:HSB色彩模式

    前面我们已经学习过了两大色彩模式RGB和CMYK.色彩模式有很多种,但这两种是最重要和最基础的.其余的色彩模式,实际上在显示的时候都需要转换为RGB,在打印或印刷(又称为输出)的时候都需要转为CMYK ...

  6. php 输出缓冲

    <?php ob_start();//开启php输出缓冲区 echo "A"; //"A"会进入php输出缓冲区 ob_flush();//将php输出缓 ...

  7. j函数 判断以 什么开头

    1.str.charAt(index) 返回字符串中指定位置的字符. str 是字符串  我们要将获得的数据 转化为字符串 var code = res.statusCode.toString(); ...

  8. VUE 生成二维码插件

    原文:https://www.jianshu.com/p/496fd1cbee8d npm install qrcodejs2 --save 页面中引入 dom 结构 JS 方法编写 export d ...

  9. Python---基础---循环，函数

    2019-05-21 ----------------------------------- # 打印出一个矩形# 控制行for i in range(1, 5):    #控制列    for j ...

  10. MySQL WAL

    原创转载请注明出处:https://www.cnblogs.com/agilestyle/p/11447794.html WAL: Write-Ahead Logging 先写日志,再写磁盘.具体说, ...