H5保存并读取临时数据

最新推荐文章于 2024-03-02 18:45:22 发布

黑妹牙膏有点甜

最新推荐文章于 2024-03-02 18:45:22 发布

阅读量5.3k

点赞数

本文链接：https://blog.csdn.net/DHM00/article/details/54730083

版权

本文介绍了H5中Web Storage用于本地存储用户信息的功能，包括sessionStorage和localStorage的使用。通过示例展示了如何使用setItem()和getItem()方法保存和读取数据，并提供了保存文本框输入并在页面显示的完整HTML、JS和CSS代码。同时，文章提到了遇到的问题和解决方法。

摘要由CSDN通过智能技术生成

1：
错误：我运行的时候没有显示出数据
=============
在H5,APP中，本地存储主要用于客户端存储用户名等简单的用户信息
1：
分析
web Storage页面存储是H5为存储数据在客户端提供的一项重要功能，因为web Storage API可以区分会话数据和长期数据。
因此相应的API可以分为2两种类型
1：
sessionStorage：保存会话数据
2：
sessionStorage：在客户端长期保存数据
3：
使用sessionStorage对象保存数据的方法
：
调用setItem()方法
格式如下：
sessionStorage.setItem(key,value);
参数key表示被保存内容的键名
参数value表示被保存内容的键值
--
成功设置键名后不再允许修改，也不能重复，如果有重复，他就会取代原来的。
2：
读取被保存的数据getItem()方法
格式如下：
sessionStorage.getItem(key);
其中参数key表示设置保存时被保存内容的键名，该方法将返回一个指定键名对应的键值，如果不存在则返回一个null值
---------
案例：
创建一个文本框，和一个读取按钮，点击按钮，读取文本框的内容并且显示在页面
HTML代码