HTML5本地存储应用sessionStorage和localStorage

html5流行之后，可以通过localStorage和sessionStorage实现浏览器端的数据存储，这两者有什么特点呢？

sessionStorage
sessionStorage属于临时会话，数据存储的有效期为：从页面打开到页面关闭的时间段,属于窗口的临时存储，页面关闭，本地存储消失

localStorage

永久存储（可以手动删除数据）

存储量限制 ( 5M )

客户端完成，不会请求服务器处理

sessionStorage数据在页面之间不能共享、 而localStorage可以实现页面之间共享

sessionStorage的应用:

 !DOCTYPE html  html  head  meta charset= UTF-8  title /title  script  window.onload = function(){ var aInput = document.getElementsByTagName( input  aInput[0].onclick = function(){ //sessionStorage: 临时存储, 只在当前页面有效,不能传递到其他页面,页面关闭之后消失 window.sessionStorage.setItem( name , aInput[3].value ); aInput[1].onclick = function(){ alert(window.sessionStorage.getItem( name )); aInput[2].onclick = function(){ window.sessionStorage.removeItem( name ); /script  /head  body  input type= button value= 设置 /  input type= button value= 获取 /  input type= button value= 删除 /  br/  input type= text /  /body  /html 

localStorage的应用

 !DOCTYPE html  html  head  meta charset= UTF-8  title /title  script  window.onload = function(){ var aInput = document.getElementsByTagName( input  aInput[0].onclick = function(){ //localStorage : 永久性存储 window.localStorage.setItem( name , aInput[3].value); window.localStorage.setItem( name2 , aaaaa  aInput[1].onclick = function(){ alert( window.localStorage.getItem( name ) ); alert( window.localStorage.getItem( name2 ) ); aInput[2].onclick = function(){ window.localStorage.removeItem( name // window.localStorage.clear(); /script  /head  body  input type= button value= 设置 /  input type= button value= 获取 /  input type= button value= 删除 /  br/  input type= text /  /body  /html 

 !DOCTYPE html  html  head  meta charset= UTF-8  title /title  script  window.onload = function () { var aInput = document.getElementsByTagName( input  var oT = document.querySelector( textarea  if (window.localStorage.getItem( userName )) { aInput[0].value = window.localStorage.getItem( userName  for (var i = 0; i aInput.length; i++) { if (window.localStorage.getItem( sex ) == aInput[i].value) { aInput[i].checked = true; if (window.localStorage.getItem( note )) { oT.value = window.localStorage.getItem( note  window.onunload = function () { if (aInput[0].value) { window.localStorage.setItem( userName , aInput[0].value); for (var i = 0; i aInput.length; i++) { if (aInput[i].checked == true) { window.localStorage.setItem( sex , aInput[i].value); if (oT.value) { window.localStorage.setItem( note , oT.value); /script  /head  body  用户名: input type= text /  性别: br/  input type= radio name= sex value= 男 / 男 input type= radio name= sex value= 女 / 女 textarea cols= 30 rows= 10 /textarea  /body  /html 

以上就是HTML5本地存储应用sessionStorage和localStorage的详细内容，其它编程语言

郑重声明：本文版权归原作者所有，转载文章仅为传播更多信息之目的，如作者信息标记有误，请第一时间联系我们修改或删除，多谢。