分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 运营维护

HTML5 简单的Web 存储(localStorage)

发布时间:2023-09-06 02:23责任编辑:彭小芳关键词:HTMLWeb
HTML5 web 存储,一个比cookie更好的本地存储方式。使用HTML5可以在本地存储用户的浏览数据。客户端存储数据的两个对象为:localStorage - 用于长久保存整个网站的数据,保存的数据没有过期时间,直到手动去除。sessionStorage - 用于临时保存同一窗口(或标签页)的数据,在关闭窗口或标签页之后将会删除这些数据。在使用 web 存储前,应检查浏览器是否支持 localStorage 和sessionStorage:if(typeof(Storage)!=="undefined"){ ???// 支持 localStorage ?sessionStorage 对象! ???// 代码.....} else { ???// 不支持 web 存储。}<div id="result"></div><script>/*实例解析:使用 key="setname" 和 value="菜鸟教程" 创建一个 localStorage 键/值对。检索键值为"setname" 的值然后将数据插入 id="result"的元素中。*/if(typeof(Storage)!=="undefined"){ ???localStorage.setname="乐视体育"; ???document.getElementById("result").innerHTML="网站名:"+localStorage.setname;}else{ ???document.getElementById("result").innerHTML="对不起,您的浏览器不支持web存储。";}</script> <script> ??/* ???????
     不管是 localStorage,还是 sessionStorage,可使用的API都相同,常用的有如下几个(以localStorage为例):保存数据:localStorage.setItem(key,value);读取数据:localStorage.getItem(key);删除单个数据:localStorage.removeItem(key);删除所有数据:localStorage.clear();得到某个索引的key:localStorage.key(index); ??*/ ???if(typeof(Storage)!=="undefined"){ ?localStorage.setItem(‘Le‘,"乐视体育"); ?document.getElementById("result").innerHTML="网站 ??????????????????名:"+localStorage.getItem(‘Le‘); ?????????document.getElementById("result").onclick=function(){localStorage.removeItem(‘Le‘); ??????????????????????//localStorage.clear();慎重使用会删除所有数据 ?} ???}else{ ?document.getElementById("result").innerHTML="对不起,您的浏览器不支 ???????????持web存储。"; ??}</script> ???????

HTML5 简单的Web 存储(localStorage)

原文地址:https://www.cnblogs.com/yscode/p/9982216.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved