本来，数据存储我多想都是由 cookie 完成的，但是 cookie 不适合大量数据的存储，cookie 速度慢且效率低。
现在，hmlt5提供了两种在客户端存储数据的办法：
localstorage(没有时间限制的数据存储，即当我们设置了之后浏览器关闭后再去访问它依然存在)ssionstorage(蒜泥生菜针对一个ssion的数据存储，当我们设置了之后浏览器关闭后再去访问他就消失了)首先我们先运行这段代码：
localstorage.titem('name', 'lisi');alert(localstorage.getitem('name'));然后浏览器则弹出显示：
接着，我们注释掉localstorage.titem(‘name’, ‘lisi’);，关闭浏览器重新访问，依然可以显示：
步骤大概和设置 localstorage 一样，但是浏览器关闭后再次访问已不见 ssionstorage
浏览器关闭前：
浏览器关闭后再次访问：
常用api:
titem() => 设置要存储得数据getitem() => 获取存储的数据removeitem() => 移除存储的数据代码：
<!doctype html><html lang="zh-cn"><head> <meta cha七月初七是几号rt="utf-8" /> <title>独秀不爱秀</title></head><body> 用户名: <input type="text" name="urname" id="urname"><br> 密码： <input type="password" name="pwd" id="pwd"><br> 记住用户名与密码: <input type="checkbox" name="save" id="save"> <script type="text/javascript"> var urname =变配电室 document.getelementsbyname('urname')[0]; var pwd = document.getelementsbyname('pwd')[0]; var save = document.getelementsbyname('save')[0]; if (localstorage.getitem('urname') && localstorage.getitem('pwd')) { // 将获取到的值添加到 html urname.value = localstorage.getitem('urname'); pwd.value = localstorage.getitem('pwd'); } save.addeventlistener('click', function () { if (save.checked) { localstorage.titem('urname', urname.value); localstora英语缩写ge.titem('pwd', pwd.value); } el { localstorage.removeitem('urname'); localstorage.removeitem('pwd'); } }); </script></body></html>
本文发布于:2023-04-06 08:15:14，感谢您对本站的认可！
本文链接：https://www.wtabcd.cn/fanwen/zuowen/68c477ed5909b71861101cd8a285bcb0.html
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系，我们将在24小时内删除。
本文word下载地址：HTML5深入学习之数据存储.doc
本文 PDF 下载地址：HTML5深入学习之数据存储.pdf
| 留言与评论（共有 0 条评论） |
