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. javascript中的对象字面量为啥这么酷

    原文链接 : Why object literals in JavaScript are cool 原文作者 : Dmitri Pavlutin 译者 : neal1991 个人主页:http://n ...

  2. webpack打包过程及开发过程

    1.传统: 1)分模块去定义js.js中要导出将来要被打包的方法module.exports 2)定义main.js入口文件(主文件).在此文件中,导入引用的js文件 var {add} = requ ...

  3. 编辑器和IDE的区别以及WebStorm和PhpStorm的区别

    编辑器和IDE的区别: 编辑器就是纯粹编辑文本的编辑器,识别级别在文字级,只显示你想写入和打开的文本内容,不管你写什么内容,只提供接收与显示功能,Windows自带的写字板就是最简单的编辑器.举个生活 ...

  4. java操作mongodb工具类

    新建maven项目 pom.xml <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="ht ...

  5. ASE Beta Sprint - backend scrum 4

    本次scrum于2019.12.10在sky garden进行,持续10分钟. 参与人: Xin Kang, Zhikai Chen, Lihao Ran, Hao Wang 请假: Ning Jia ...

  6. 一条sql引发的“血案”

    前几天有一个项目要上线,需要对表的一个字段进行扩充,项目经理让我准备脚本,于是我准备了如下的脚本: )); )); )); 结果上线的时候,ord_log1和ord_log2表中有30万数据,在执行的 ...

  7. linux查看 rsync 服务状态

    [root@rsync-server-1 /]# lsof -i tcp:873 COMMAND  PID USER  FD  TYPE DEVICE SIZE/OFF NODE NAME rsync ...

  8. OGG复制进程延迟不断增长

    1.注意通过进程查找sql_id时,进程号要查询两次 2.杀进程的连接 https://www.cnblogs.com/kerrycode/p/4034231.html 参考资料 1.https:// ...

  9. ffmpeg windows下编译安装

    安装msys2 更新源使下载速度更快 进入msys64/etc/pacman.d/目录中,分别在三个文件中增加mirrorlist.mingw32Server = http://mirrors.ust ...

  10. w = tf.Variable(<initial-value>, name=<optional-name>)

    w = tf.Variable(<initial-value>, name=<optional-name>)